<template>
  <div class="app-container customer-div">
    <el-menu :default-active="listQuery.tab" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="my">我负责的</el-menu-item>
<!--      <el-menu-item index="myParticipate">我参与的</el-menu-item>-->
      <el-menu-item index="public" v-if="isCanCustomerByGHC">公海池</el-menu-item>
      <el-menu-item index="dept" v-if="isCanCustomerByDept">部门客户</el-menu-item>
      <el-menu-item index="company" v-if="isCanCustomerByAll">全部客户</el-menu-item>
      <el-menu-item index="del">回收站</el-menu-item>
      <el-menu-item :index="null">客户查询</el-menu-item>
      <el-menu-item index="blacklist">黑名单</el-menu-item>
      <el-menu-item index="threeMonths" v-if="unOrdercustomer">未成交</el-menu-item>
      <el-menu-item index="examine" v-if="customerCheck">客户审核</el-menu-item>
      <el-menu-item index="waitMyCheck">客户接收</el-menu-item>
      <el-menu-item index="fz">纺织品客户</el-menu-item>
      <el-menu-item index="guanlian" v-if="relationCustomer">关联客户</el-menu-item>
<!--      <el-menu-item index="checkDuplicate">公司查重</el-menu-item>-->
    </el-menu>
    <div style="padding-top:20px">
      <el-button
              size="small"
              v-if="listQuery.tab=='my' || listQuery.tab=='company'"
              @click="toAddCustomer('add')"
              type="primary">
         新增客户
      </el-button>
      <el-button v-if="listQuery.tab=='company' && productLineBatchUpdate" @click="showImport2" size="small">
        批量更新产品线负责人
      </el-button>

      <el-button v-if="listQuery.tab=='company'" @click="showImport('zhuangYi')" size="small">
        批量客户转移
      </el-button>
    </div>
    <!--我负责的/我参与的/公海池/部门客户/回收站/全部---->
    <div style="font-size:12px;color:red;line-height: 20px" v-if="listQuery.tab == 'public'">
      公海池： 客户使用塑料原料，未使用公司主营塑料原料
    </div>
    <div style="margin-top: 20px" v-if="listQuery.tab && (listQuery.tab == 'my' || listQuery.tab == 'myParticipate' || listQuery.tab == 'public' || listQuery.tab == 'dept' || listQuery.tab == 'company' || listQuery.tab == 'del')">
    <!--搜索-->
    <el-form :inline="true" :model="listQuery" size="mini" label-width="120px">
      <el-form-item label="客户名称：">
        <el-autocomplete
                clearable
                class="inline-input"
                value-key="customerName"
                :fetch-suggestions="querySearch"
                v-model="listQuery.keyword"
                placeholder="请输入内容"
                @select="handleSelectCustomerName"
                :trigger-on-focus="false"
        ></el-autocomplete>
      </el-form-item>
      <el-form-item label="统一社会信用码：" label-width="150px">
        <el-input v-model="listQuery.businessCode" class="input-width" style="width:195px"></el-input>
      </el-form-item>
      <el-form-item label="客户状态：">
        <el-select v-model.number="listQuery.customerState" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerStateList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户性质：">
        <el-select v-model.number="listQuery.customerQuality" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerQualityList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户分类：">
        <el-select v-model.number="listQuery.customerType" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerTypeList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户来源：">
        <el-select v-model.number="listQuery.customerSource" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerSourceList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户等级：">
        <el-select v-model.number="listQuery.customerGrade" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option value="A1" label="A1" key="A1"></el-option>
          <el-option value="A2" label="A2" key="A2"></el-option>
          <el-option value="A3" label="A3" key="A3"></el-option>
          <el-option value="A4" label="A4" key="A4"></el-option>
          <el-option value="B" label="B" key="B"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="部门：" v-if="listQuery.tab=='dept' || listQuery.tab=='company'">
        <el-select v-model.number="listQuery.departmentId" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.departmentId" :label="item.departmentName" :key="item.departmentId" v-for="item in deptList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="预计成交日期：">
        <el-date-picker
                :default-time="['00:00:00', '23:59:59']"
                v-model="listQuery.transactionTime"
                type="daterange"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="月毛利区间：">
        <el-select v-model.number="listQuery.customerDegree" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerDegreeList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="跟进状态：" v-if="listQuery.tab !='my'">
        <el-select v-model.number="listQuery.customerTracking" class="input-width" style="width:195px" placeholder="请选择" clearable>
          <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerTrackingList"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="最后联系日期：">
        <el-date-picker
                :default-time="['00:00:00', '23:59:59']"
                v-model="listQuery.trackingTime"
                type="daterange"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="创建日期：">
        <el-date-picker
                :default-time="['00:00:00', '23:59:59']"
                v-model="listQuery.createdAt"
                type="daterange"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="更新日期：">
        <el-date-picker
                :default-time="['00:00:00', '23:59:59']"
                v-model="listQuery.updatedAt"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="负责人：" v-if="listQuery.tab=='dept' || listQuery.tab=='company'">
        <el-select v-model="listQuery.chargeId" filterable placeholder="请选择" clearable>
          <el-option
                  :key="-1"
                  label="公海池"
                  :value="-1">
          </el-option>
          <el-option
                  v-for="item in userOptionList"
                  :key="item.userId"
                  :label="item.realName"
                  :value="item.userId">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="创建人：" v-if="listQuery.tab=='dept' || listQuery.tab=='company'">
        <el-select v-model="listQuery.createrId" filterable placeholder="请选择" clearable>
          <el-option
                  v-for="item in userOptionList"
                  :key="item.userId"
                  :label="item.realName"
                  :value="item.userId">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="采购评级：">
        <el-select v-model.number="listQuery.customerLabel" class="input-width" style="width:195px" placeholder="请选择" clearable >
          <el-option value="A类" label="A类" key="A类"></el-option>
          <el-option value="B类" label="B类" key="B类"></el-option>
          <el-option value="C类" label="C类" key="C类"></el-option>
          <el-option value="D类" label="D类" key="D类"></el-option>
          <el-option value="E类" label="E类" key="E类"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否有统一社会信用码：" v-if="listQuery.tab == 'company' || listQuery.tab == 'my'  " label-width="180px">
        <el-select v-model.number="listQuery.hasBusinessCode" class="input-width" style="width:195px" placeholder="请选择" clearable >
          <el-option :value="1" label="是" :key="1"></el-option>
          <el-option :value="0" label="否" :key="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="潜在等级：">
        <el-select v-model="listQuery.customerPotential" class="input-width" style="width:195px" placeholder="请选择" multiple>
          <el-option
                  v-for="item in customerPotentialList"
                  :key="item.customerPotentialId"
                  :label="item.customerPotentialValue"
                  :value="item.customerPotentialId">
          </el-option>
          <el-option
                  :key="0"
                  label="无潜在等级"
                  :value="0">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="类别：" v-if="listQuery.tab=='company'">
        <el-select v-model="listQuery.typeList" filterable placeholder="请选择" multiple clearable>
          <el-option
                  v-for="item in customerLeiBie"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="客户类型：" v-if="listQuery.tab=='company'">
        <el-select v-model="listQuery.profitType" placeholder="请选择" clearable>
          <el-option key="develop" label="开发客户" value="develop"></el-option>
          <el-option key="move" label="流转客户" value="move"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="所在地区：" v-if="listQuery.tab=='company' || listQuery.tab=='my' || listQuery.tab == 'dept' || listQuery.tab=='public'">
        <el-select v-model="areaId1" placeholder="请选择省" @change="changeAreaId1" style="width:120px" clearable>
          <el-option v-for="item in  options"  :key="item.areaId" :label="item.areaName"  :value="item.areaId" ></el-option>
        </el-select>

        <el-select v-model="areaId2" placeholder="请选择市" @change="changeAreaId2" v-if="areaId1" style="width:120px" clearable>
          <el-option v-for="item in  options[areaIndex1]['areaChildList']"  :key="item.areaId" :label="item.areaName"  :value="item.areaId"></el-option>
        </el-select>
        <el-select v-model="areaId2" placeholder="请选择市" @change="changeAreaId2" v-else style="width:120px" clearable></el-select>
        <el-select v-model="areaId3" placeholder="请选择区" v-if="areaId1 && areaId2" style="width:120px" clearable>
          <el-option v-for="item in  options[areaIndex1]['areaChildList'][areaIndex2]['areaChildList']"  :key="item.areaId" :label="item.areaName"  :value="item.areaId"></el-option>
        </el-select>
        <el-select v-model="areaId3" placeholder="请选择区" v-else style="width:120px"></el-select>
      </el-form-item>

      <el-form-item label="排序：" v-if="listQuery.tab=='company' || listQuery.tab=='my' ">
        <el-select v-model="sort" placeholder="请选择" clearable>
          <el-option key="orderNumAsc" label="成交量升序" value="orderNumAsc"></el-option>
          <el-option key="orderNumDesc" label="成交量降序" value="orderNumDesc"></el-option>
          <el-option key="orderTimeAsc" label="最近成交时间升序" value="orderTimeAsc"></el-option>
          <el-option key="orderTimeDesc" label="最近成交时间降序" value="orderTimeDesc"></el-option>
          <!--<el-option key="trackingTimeAsc" label="跟进时间升序" value="trackingTimeAsc"></el-option>-->
          <el-option key="trackingTimeDesc" label="跟进时间降序" value="trackingTimeDesc"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否有客户分类：" v-if="listQuery.tab=='company' || listQuery.tab=='my' ">
        <el-select v-model="hasCustomerType" placeholder="请选择" clearable>
          <el-option :key="1" label="是" :value="1"></el-option>
          <el-option :key="0 " label="否" :value="0 "></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否有质量协议：" v-if="listQuery.tab=='company' || listQuery.tab=='my' ">
        <el-select v-model="hasAgreement" placeholder="请选择" clearable>
          <el-option :key="1" label="是" :value="1"></el-option>
          <el-option :key="0 " label="否" :value="0 "></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="最近成交时间：" v-if="listQuery.tab=='my'|| listQuery.tab == 'public' || listQuery.tab == 'dept' || listQuery.tab == 'company'">
        <el-date-picker
          v-model="listQuery.lastOrderTime"
          format="yyyy 年 MM 月 dd 日"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="客户关系：" v-if="listQuery.tab=='company'">
        <el-select v-model="isMainCustomer" placeholder="请选择" clearable>
          <el-option :key="1" label="主客户" :value="1"></el-option>
          <el-option :key="0 " label="子客户" :value="0 "></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否为外贸客户" >
        <el-select v-model="listQuery.isChina" placeholder="请选择" clearable>
          <el-option :key="2" label="是" :value="2"></el-option>
          <el-option :key="1 " label="否" :value="1 "></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="使用材料" v-if="listQuery.tab=='company' || listQuery.tab=='dept'">
        <el-input v-model="listQuery.categoryName"></el-input>
      </el-form-item>
      <el-form-item label="成交产品" v-if="listQuery.tab=='company' || listQuery.tab=='dept'">
        <el-input v-model="listQuery.goodsName"></el-input>
      </el-form-item>
      <el-form-item label="跟进关键字" v-if="listQuery.tab=='company' || listQuery.tab=='dept'">
        <el-input v-model="listQuery.trackingContent"></el-input>
      </el-form-item>
      <el-form-item label="子客户" v-if=" listQuery.tab=='my' || listQuery.tab=='company' || listQuery.tab=='dept'">
        <el-select v-model="listQuery.hasOne">
          <el-option :value="1" label="显示"></el-option>
          <el-option :value="0" label="不显示"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="产品线：" v-if=" listQuery.tab=='public'">
        <el-select v-model="listQuery.goodsLineId" filterable clearable>
          <el-option :label="item.cddValue" v-for="item in goodsLineList" :value="item.cddId" :key="item.cddId"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button
                @click="handleSearchList()"
                type="primary">
          查询
        </el-button>
        <el-button
                v-if="isCanCustomerByImport"
                @click="showImport()">
          导入
        </el-button>
        <!--v-if="isCanCustomerByImport"--->
        <el-button v-if="listQuery.tab == 'company' && customerByAllExport" @click="downloadExcel">
          导出
        </el-button>

        <el-button v-if="listQuery.tab == 'company' && customerByAllExport" @click="showExportPop">
          自定义导出
        </el-button>

      </el-form-item>
    </el-form>
  </div>
    <!--三个月未成交---->
    <div style="margin-top: 20px" v-if="listQuery.tab && listQuery.tab == 'threeMonths'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="120px">
        <el-form-item label="客户名称：">
          <el-autocomplete
                  clearable
                  class="inline-input"
                  value-key="customerName"
                  :fetch-suggestions="querySearch"
                  v-model="listQuery.keyword"
                  placeholder="请输入内容"
                  @select="handleSelectCustomerName"
                  :trigger-on-focus="false"
          ></el-autocomplete>
        </el-form-item>
        <el-form-item label="负责人：">
          <el-select v-model="listQuery.chargeId" filterable placeholder="请选择" clearable>
            <el-option
                    v-for="item in userOptionList"
                    :key="item.userId"
                    :label="item.realName"
                    :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="距上次成交时间：">
           <el-input v-model="dayNum" class="input-width" style="width:100px"></el-input>
          <span style="padding-left:5px">天</span>
        </el-form-item>
        <el-form-item label="未成交原因：">
          <el-select v-model="unOrderReasonId" class="input-width" style="width:195px" placeholder="请选择" clearable>
            <el-option
                    v-for="item in unOrderReasonlist"
                    :key="item.cddId"
                    :label="item.cddValue"
                    :value="item.cddId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所在地区：" >
          <el-cascader
                  clearable
                  v-model="listQuery.diQuIds"
                  :props="{ value: 'areaId',label:'areaName',children:'areaChildList' }"
                  :options="options"></el-cascader>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>
          <el-button
                  @click="showImport3()"
                  type="primary">
            导入
          </el-button>
          <el-button
                  v-if="unOrderSolutions"
                  @click="toSetWeiChengJiao"
                  type="warning">
            设置未成交原因及对策
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <!--客户查询---->
    <div style="margin-top: 20px" v-if="!listQuery.tab">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
        <input id="hiddenText" type="text" style="display:none" />
        <el-form-item label="关键字：">
          <el-input v-model.trim="listQuery.keyword" class="input-width" style="width:300px" placeholder="公司名称/手机号,最少输入4个字符" clearable  @keydown.enter.native="keywordSearch()">
          </el-input>
        </el-form-item>
        <el-form-item label="统一社会信用码：" label-width="150">
          <el-input v-model="listQuery.businessCode" class="input-width" style="width:195px"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="keywordSearch()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <!--黑名单---->
    <div style="margin-top: 20px" v-if="listQuery.tab == 'blacklist'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
        <input id="hiddenText1" type="text" style="display:none" />
        <el-form-item label="客户名称：">
          <el-input v-model="listQuery.keyword" class="input-width" style="width:300px"  clearable  @keydown.enter.native="handleSearchList()">
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
    </div>

    <!--客户审核---->
    <div style="margin-top: 20px" v-if="listQuery.tab == 'examine'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
        <input  type="text" style="display:none" />
        <el-form-item label="客户名称：">
          <el-input v-model="listQuery.customerName" class="input-width" style="width:300px"  clearable>
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
    </div>

    <!--公司查重---->
    <div style="margin-top: 20px" v-if="listQuery.tab == 'checkDuplicate'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
        <el-form-item label="去重条件：">
          <el-select v-model.number="listQuery.customerPotential" class="input-width" style="width:195px" placeholder="请选择" clearable >
            <el-option
                    v-for="item in removerType"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
    </div>

    <!--纺织品客户---->
    <div style="margin-top: 20px" v-if="listQuery.tab && listQuery.tab == 'fz'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
        <input  type="text" style="display:none" />
        <el-form-item label="客户名称：">
          <el-input v-model="listQuery.customerName" class="input-width" style="width:300px"  clearable>
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
    </div>


    <!--关联客户---->
    <div style="margin-top: 20px" v-if="listQuery.tab && listQuery.tab == 'guanlian'">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="120px">
        <el-form-item label="客户名称：">
          <el-autocomplete
                  clearable
                  class="inline-input"
                  value-key="customerName"
                  :fetch-suggestions="querySearch"
                  v-model="listQuery.keyword"
                  placeholder="请输入内容"
                  @select="handleSelectCustomerName"
                  :trigger-on-focus="false"
          ></el-autocomplete>
        </el-form-item>
        <el-form-item label="负责人：">
          <el-select v-model="listQuery.chargeId" filterable placeholder="请选择" clearable>
            <el-option
                    v-for="item in userOptionList"
                    :key="item.userId"
                    :label="item.realName"
                    :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="创建人：">
          <el-select v-model="listQuery.createrId" filterable placeholder="请选择" clearable>
            <el-option
                    v-for="item in userOptionList"
                    :key="item.userId"
                    :label="item.realName"
                    :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button
                  @click="handleSearchList()"
                  type="primary">
            查询
          </el-button>

          <el-button
                  v-if="exportRelationCustomer"
                  :loading="btnLoading9"
                  @click="guanglianDownloadExcel()"
                  type="primary">
            导出
          </el-button>
        </el-form-item>
      </el-form>
    </div>

      <!--数据列表-->
      <div v-if="listQuery.tab">
        <!--我负责的/我参与的/公海池/部门客户--->
        <div class="table-container" v-if="listQuery.tab && (listQuery.tab == 'my' || listQuery.tab == 'myParticipate' || listQuery.tab == 'public' || listQuery.tab == 'dept')">
          <el-table
                  @selection-change="handleSelectionChange"
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column  align="center" label="金蝶编号" prop="kingNumber"></el-table-column>
            <el-table-column  align="center" label="社会统一信用码" prop="businessCode" width="180"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                  <span v-if="scope.row.isRelation == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">关联</span>
                  <span v-if="scope.row.hasAgreement == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">质</span>
                </el-link>
                <div>{{ scope.row.goodsLineNames }}</div>
              </template>
            </el-table-column>
             <el-table-column
                    label="主客户名称"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row,scope.row.parentId)" type="primary">
                  {{scope.row.parentName}}
                </el-link>
<!--                 <span @click="toDetail(scope.row,scope.row.parentId)">-->
<!--                    {{scope.row.parentName}}-->
<!--                 </span>-->
              </template>
            </el-table-column> -->
            <el-table-column
                    label="最新跟进内容"
                    width="300">
              <template slot-scope="scope">
                  {{scope.row.lastTrackingContent}}
              </template>
            </el-table-column>
            <el-table-column
              label="最新跟跟进时间"
              width="150">
              <template slot-scope="scope">
                {{scope.row.lastTrackingTime}}
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="采购评级"
                    width="100">
              <template slot-scope="scope">
                <span>
                   {{scope.row.customerLabel}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="客户等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerGrade}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="潜在等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerPotentialName}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="成交量"
                    width="100">
              <template slot-scope="scope">
                <span>
                    {{scope.row.customerOrderNum}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    v-if="listQuery.tab == 'public'"
                    prop="noChargeTime"
                    align="center"
                    label="转移到公海日期"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.noChargeTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="月毛利区间"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.customerDegree}}
                </div>
                <div v-else>
                  {{scope.row.customerDegree.cddValue}}
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                <span v-if="listQuery.tab != 'public'">
                   {{scope.row.contactName}}
                </span>
                <span v-else>
                  *********
                </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="联系方式"
                    align="center"
                    width="100">
              <template slot-scope="scope">
                <span v-if="listQuery.tab != 'public'">
                   {{scope.row.contactMobile}}
                </span>
                <span v-else>
                  *********
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    prop="customerState.cddValue"
                    label="客户状态"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.customerState}}
                </div>
                <div v-else>
                  {{scope.row.customerState.cddValue}}
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    :key="Math.random()"
                    v-if="listQuery.tab == 'my'"
                    label="最近跟进时间"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                   {{scope.row.trackingTime}}
              </template>
            </el-table-column>
            <el-table-column
                    :key="Math.random()"
                    v-if="listQuery.tab == 'my'"
                    label="最近跟进内容"
                    width="200">
              <template slot-scope="scope">
                {{scope.row.trackingContent}}
              </template>
            </el-table-column>
            <el-table-column
                    label="预计成交日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.transactionEndTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="trackingTime"
                    label="最近联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastOrderTime"
                    label="最近成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.chargeName}}
                </div>
                <div v-else>
                  <span v-if="scope.row.charge">
                     {{scope.row.charge.realName}}
                  </span>
                </div>
              </template>
            </el-table-column>
            <el-table-column
              label="负责时间"
              width="100"
              align="center">
              <template slot-scope="scope">
                  {{scope.row.chargeStartTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户分类"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.customerType}}
                </div>
                <div v-else>
                  <span v-if="scope.row.customerType">
                    {{scope.row.customerType.cddValue}}
                 </span>
                </div>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.customerIndustry}}
                </div>
                <div v-else>
                   <span v-if="scope.row.customerIndustry">
                    {{scope.row.customerIndustry.cddValue}}
                 </span>
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户来源"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.customerSource}}
                </div>
                <div v-else>
                    <span v-if="scope.row.customerSource">
                     {{scope.row.customerSource.cddValue}}
                 </span>
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户类别"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.typeList | fifTypeList}}
                </div>
                <div v-else>
                    <span v-if="scope.row.customerSource">
                     {{scope.row.typeList | fifTypeList}}
                 </span>
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户种类"
                    width="100"
                    align="center">
              <template slot-scope="scope">
               <span>{{ scope.row.isChina | filterIsChina }}</span>
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.createTime}}
                </div>
                <div v-else>
                  {{scope.row.createdAt}}
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <div v-if="listQuery.tab == 'my'">
                  {{scope.row.createUser}}
                </div>
                <div v-else>
                   <span v-if="scope.row.creator">
                     {{scope.row.creator.realName}}
                  </span>
                </div>

              </template>
            </el-table-column>
            <el-table-column
                    width="150"
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                  v-if="listQuery.tab == 'my' && scope.row.chargeId == userId"
                  type="text"
                  size="mini"
                  @click="showDengjiForm(scope.row)">潜在等级
                </el-button>
<!--                <el-button-->
<!--                        v-if="listQuery.tab == 'my' && scope.row.chargeId == userId"-->
<!--                        type="text"-->
<!--                        size="mini"-->
<!--                        @click="toAddCustomer('edit',scope.row)">编辑-->
<!--                </el-button>-->
                <el-button
                        v-else-if="listQuery.tab == 'public'"
                        type="text"
                        size="mini"
                        @click="toDetail(scope.row)">查看
                </el-button>
                <el-button
                        v-else-if="listQuery.tab != 'del'"
                        type="text"
                        size="mini"
                        @click="toAddCustomer('see',scope.row)">查看
                </el-button>
                <el-button
                        v-else
                        type="text"
                        size="mini"
                        @click="huanyuang(scope.row)">还原
                </el-button>
                <el-button
                        v-if="listQuery.tab == 'public'"
                        type="text"
                        size="mini"
                        @click="showQuit(scope.row)">转移
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!--全部客户--->
        <div class="table-container" v-if="listQuery.tab &&  listQuery.tab == 'company'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column  align="center" label="金蝶编号" prop="kingNumber"></el-table-column>
            <el-table-column  align="center" label="社会统一信用码" prop="businessCode" width="180"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary" style="font-size:12px">
                  {{scope.row.customerName}}
                  <span v-if="scope.row.isRelation == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">关联</span>
                  <span v-if="scope.row.hasAgreement == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">质</span>
                  <img src="../../assets/images/ya.png" v-if="scope.row.isEnableYunLink == 1"  style="vertical-align: middle;"/>
                </el-link>
                <div>{{ scope.row.goodsLineNames }}</div>
              </template>
            </el-table-column>
            <el-table-column
                    label="主客户名称"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row,scope.row.parentId)" type="primary">
                  {{scope.row.parentName}}
                </el-link>
<!--                 <span @click="">-->
<!--                    {{scope.row.parentName}}-->
<!--                 </span>-->
              </template>
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.charge">
                    {{scope.row.charge.realName}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
              label="负责时间"
              width="100"
              align="center">
              <template slot-scope="scope">
                {{scope.row.chargeStartTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="类别"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.typeList | fifTypeList}}
              </template>
            </el-table-column>
            <el-table-column
                    label="产品线"
                    width="300">
              <template slot-scope="scope">
                  {{scope.row.goodsLineNames}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最近联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastTrackingContent"
                    label="最近跟进内容"
                    width="300">
            </el-table-column>
            <el-table-column
                    prop="nextTrackingTime"
                    label="下次跟进日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    align="center"
                    label="采购评级"
                    width="100">
              <template slot-scope="scope">
                {{scope.row.customerLabel}}
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="客户等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerGrade}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="潜在等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerPotentialName}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="成交量"
                    width="100">
              <template slot-scope="scope">
                <span>
                    {{scope.row.customerOrderNum}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="是否持续跟进"
                    width="100">
              <template slot-scope="scope">
              <span>
                  {{scope.row.isContinueTracking == 1 ? '是' : '否'}}
              </span>
              </template>
            </el-table-column>
            <el-table-column
                    v-if="listQuery.tab == 'public'"
                    prop="noChargeTime"
                    align="center"
                    label="转移到公海日期"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.noChargeTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="customerDegree.cddValue"
                    label="月毛利区间"
                    align="center"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.contactName}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="contactMobile"
                    label="联系方式"
                    align="center"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="customerState.cddValue"
                    label="客户状态"
                    width="100"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="预计成交日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.transactionEndTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>

            <el-table-column
                    prop="lastOrderTime"
                    label="最近成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="客户分类"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerType">
                     {{scope.row.customerType.cddValue}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerIndustry">
                      {{scope.row.customerIndustry.cddValue}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户来源"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.customerSource">
                      {{scope.row.customerSource.cddValue}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户类型"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.customerSource">
                      {{scope.row.profitType | fifprofitType}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户种类"
                    width="100"
                    align="center">
              <template slot-scope="scope">
               <span>{{ scope.row.isChina | filterIsChina }}</span>
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createdAt}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.creator">
                      {{scope.row.creator.realName}}
                 </span>

              </template>
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    width="180"
                    align="center">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="mini"
                  v-if="yunLinkCustomerConfirm"
                  @click="showApply(scope.row)">申请授信
                </el-button>

                <el-button
                        type="text"
                        size="mini"
                        @click="toAddCustomer('see',scope.row)">查看
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showSetLabel(scope.row)">采购评级
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showSetClass(scope.row)">客户类型
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showQuit(scope.row)">转移
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showDengjiForm(scope.row)">潜在等级
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!--回收站--->
        <div class="table-container" v-if="listQuery.tab && listQuery.tab == 'del'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column  align="center" label="金蝶编号" prop="kingNumber"></el-table-column>
            <el-table-column  align="center" label="社会统一信用码" prop="businessCode" width="180"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="客户等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerGrade}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    prop="customerDegree.cddValue"
                    label="月毛利区间"
                    align="center"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.contactName}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="contactMobile"
                    label="联系方式"
                    align="center"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="customerState.cddValue"
                    label="客户状态"
                    width="100"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="预计成交日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.transactionEndTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="trackingTime"
                    label="最近联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastOrderTime"
                    label="最近成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                <span v-if="scope.row.charge">
                     {{scope.row.charge.realName}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户分类"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerType">
                     {{scope.row.customerType.cddValue}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.customerIndustry">
                     {{scope.row.customerIndustry.cddValue}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    label="客户来源"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerSource">
                     {{scope.row.customerSource.cddValue}}
                 </span>


              </template>
            </el-table-column>

            <el-table-column
                    label="客户种类"
                    width="100"
                    align="center">
              <template slot-scope="scope">
               <span>{{ scope.row.isChina | filterIsChina }}</span>
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createdAt}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.creator">
                      {{scope.row.creator.realName}}
                  </span>
              </template>
            </el-table-column>
              <el-table-column
                      label="删除时间"
                      width="150"
                      align="center">
                <template slot-scope="scope">
                  {{scope.row.deleteTime == 0 ? '' : scope.row.deleteTime}}
                </template>
              </el-table-column>
              <el-table-column
                      label="删除理由"
                      width="300">
                <template slot-scope="scope">
                  {{scope.row.deleteReason}}
                </template>
              </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        v-if="scope.row.isMyCanRecover==1"
                        @click="huanyuang(scope.row)">还原
                </el-button>
<!--                <el-button-->
<!--                        type="text"-->
<!--                        size="mini"-->
<!--                        @click="neverDel(scope.row)">永久删除-->
<!--                </el-button>-->
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!--黑名单-->
        <div class="table-container" v-if="listQuery.tab && listQuery.tab == 'blacklist'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.mainContact}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="contactMobile"
                    label="联系方式"
                    align="center"
                    width="120">
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerIndustry}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户来源"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerSource}}
              </template>
            </el-table-column>
            <el-table-column
                    label="最新成交日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.lastOrderTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最新联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.creatorName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="加入黑名单日期"
                    width="130"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.blackListTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="备注"
                    width="200">
              <template slot-scope="scope">
                {{scope.row.blackListRemark}}
              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        @click="removeBlack(scope.row)">解除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!--三个月未成交--->
        <div class="table-container"  v-if="listQuery.tab && listQuery.tab == 'threeMonths'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData2"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column
                    label="客户名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                  <span v-if="scope.row.isPa6Used==1" class="title-tab">PA6</span>
                  <span v-if="scope.row.isPa66Used==1" class="title-tab">PA66</span>
                  <span v-if="scope.row.isPcUsed==1" class="title-tab">PC</span>
                  <span v-if="scope.row.isAbsUsed==1" class="title-tab">ABS</span>
                  <span v-if="scope.row.isOtherUsed==1" class="title-tab">其它</span>
                  <span v-if="scope.row.isRelation == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">关联</span>
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="关联客户"
                    width="300">
              <template slot-scope="scope">
                {{scope.row.relationCustomers | fifrelationCustomers}}
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="采购等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerLabel}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="客户等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerGrade}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastOrderTime"
                    label="上次成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastOrderMonth"
                    label="距上次成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最近联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="areaInfo"
                    label="所在地区"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="客户分类"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerType}}
              </template>
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.chargeName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createTime}}
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="原因&对策"
                    width="400">
              <template slot-scope="scope">
                <el-table
                        v-if="scope.row.unOrderReasonList.length > 0"
                        :data="scope.row.unOrderReasonList"
                        border>
                  <el-table-column
                          prop="reasonValue"
                          header-align="center"
                          label="原因"
                          width="150">
                  </el-table-column>
                  <el-table-column
                          prop="reasonValue"
                          header-align="center"
                          label="对策">
                    <template slot-scope="scope">
                        {{scope.row.children | fiflist}}
                    </template>
                  </el-table-column>
                </el-table>
              </template>
            </el-table-column>
            <el-table-column
                    label="操作时间"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                    {{scope.row.unOrderReasonTime}}
              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="120"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        @click="showNodealiForm(scope.row)">修改
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="toAddCustomer('see',scope.row)">查看
                </el-button>

              </template>
            </el-table-column>
          </el-table>
        </div>

        <!--客户审核-->
        <div class="table-container" v-if="listQuery.tab && listQuery.tab == 'examine'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData3"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column
                    label="金蝶编号"
                    align="center"
                    width="100">
              <template slot-scope="scope">
                  {{scope.row.kingNumber}}
              </template>
            </el-table-column>
            <el-table-column
                    label="社会统一信用码"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.businessCode}}
              </template>
            </el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.mainContact}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerIndustry}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最新联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createrName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户状态"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerState}}
              </template>
            </el-table-column>
            <el-table-column
                    label="审核类型"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  {{scope.row.checkType | fifTypeList}}
              </template>
            </el-table-column>

            <el-table-column
                    label="备注"
                    width="200"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.applyRemark}}
              </template>
            </el-table-column>

            <el-table-column
                    label="操作人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.applyName}}
              </template>
            </el-table-column>

            <el-table-column
                    label="操作时间"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.applyTime}}
              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        @click="showPassItem(scope.row)">审核
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>


        <!--客户接收-->
        <div class="table-container" v-if="listQuery.tab && listQuery.tab == 'waitMyCheck'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData4"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column
                    label="金蝶编号"
                    align="center"
                    width="100">
              <template slot-scope="scope">
                {{scope.row.kingNumber}}
              </template>
            </el-table-column>
            <el-table-column
                    label="社会统一信用码"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.businessCode}}
              </template>
            </el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="采购评级"
                    width="100">
              <template slot-scope="scope">
                {{scope.row.customerLabel}}
              </template>
            </el-table-column>
            <el-table-column
                    label="月毛利区间"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                <div>
                  {{scope.row.customerDegree}}
                </div>
              </template>
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.contactName}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="trackingTime"
                    label="最新联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastOrderTime"
                    label="最近成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  {{scope.row.chargeName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="状态"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.checkType | fifTypeList}}
              </template>
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        @click="passItemPass(1,scope.row)">接收
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="passItemPass(0,scope.row)">拒绝
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>


        <!--公司查重-->
        <div class="table-container" v-if="listQuery.tab && listQuery.tab == 'checkDuplicate'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary"  style="font-size:12px">
                  {{scope.row.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="统一信用码"
                    width="150">
              <template slot-scope="scope">
                  {{scope.row.customerName}}
              </template>
            </el-table-column>

            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.mainContact}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.customerIndustry}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最新联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.creatorName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="类别"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.typeList | fifTypeList}}
              </template>
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        v-if="scope.row.typeList != 'isBlackList'"
                        type="text"
                        size="mini"
                        @click="neverDel(scope.row)">永久删除
                </el-button>
                <el-button
                        v-if="scope.row.typeList == 'normal'||scope.row.typeList == 'noCharge'"
                        type="text"
                        size="mini"
                        @click="showDel(scope.row)">删除
                </el-button>
                <el-button
                        v-if="scope.row.typeList == 'isDelete'"
                        type="text"
                        size="mini"
                        @click="huanyuang(scope.row)">还原
                </el-button>

              </template>
            </el-table-column>
          </el-table>
        </div>


        <!--关联客户--->
        <div class="table-container" v-if="listQuery.tab &&  listQuery.tab == 'guanlian'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData6"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column  align="center" label="金蝶编号" prop="kingNumber" width="150"></el-table-column>
            <el-table-column  align="center" label="社会统一信用码" prop="businessCode" width="180"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary" style="font-size:12px">
                  {{scope.row.customerName}}
                  <span v-if="scope.row.isPa6Used==1" class="title-tab">PA6</span>
                  <span v-if="scope.row.isPa66Used==1" class="title-tab">PA66</span>
                  <span v-if="scope.row.isPcUsed==1" class="title-tab">PC</span>
                  <span v-if="scope.row.isAbsUsed==1" class="title-tab">ABS</span>
                  <span v-if="scope.row.isOtherUsed==1" class="title-tab">其它</span>
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="关联的客户">
              <template slot-scope="scope">
                <el-link @click="toDetail(item)" type="primary" style="font-size:12px;margin-right:10px" v-for="item in scope.row.relationCustomers" :key="item.customerId">
                  {{item.customerName}}
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                    {{scope.row.chargeName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                      {{scope.row.createUser}}
              </template>
            </el-table-column>
          </el-table>
        </div>

        <!--纺织客户--->
        <div class="table-container" v-if="listQuery.tab &&  listQuery.tab == 'fz'">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column  align="center" label="金蝶金蝶编号" prop="kingNumber"></el-table-column>
            <el-table-column  align="center" label="社会统一信用码" prop="businessCode" width="180"></el-table-column>
            <el-table-column
                    label="公司名称"
                    width="300">
              <template slot-scope="scope">
                <el-link @click="toDetail(scope.row)" type="primary" style="font-size:12px">
                  {{scope.row.customerName}}
                  <span v-if="scope.row.isPa6Used==1" class="title-tab">PA6</span>
                  <span v-if="scope.row.isPa66Used==1" class="title-tab">PA66</span>
                  <span v-if="scope.row.isPcUsed==1" class="title-tab">PC</span>
                  <span v-if="scope.row.isAbsUsed==1" class="title-tab">ABS</span>
                  <span v-if="scope.row.isOtherUsed==1" class="title-tab">其它</span>
                  <span v-if="scope.row.isRelation == 1" class="title-tab" style="color:#fff;background: rgb(249, 177, 73)">关联</span>
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
                    label="负责人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.charge">
                    {{scope.row.charge.realName}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="类别"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.typeList | fifTypeList}}
              </template>
            </el-table-column>
            <el-table-column
                    label="产品线"
                    width="300">
              <template slot-scope="scope">
                {{scope.row.goodsLineNames}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastTrackingTime"
                    label="最近联系日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="lastTrackingContent"
                    label="最近跟进内容"
                    width="300">
            </el-table-column>
            <el-table-column
                    prop="nextTrackingTime"
                    label="下次跟进日期"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    align="center"
                    label="采购评级"
                    width="100">
              <template slot-scope="scope">
                {{scope.row.customerLabel}}
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="客户等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerGrade}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="潜在等级"
                    width="100">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerPotentialName}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    label="是否持续跟进"
                    width="100">
              <template slot-scope="scope">
              <span>
                  {{scope.row.isContinueTracking == 1 ? '是' : '否'}}
              </span>
              </template>
            </el-table-column>
            <el-table-column
                    v-if="listQuery.tab == 'public'"
                    prop="noChargeTime"
                    align="center"
                    label="转移到公海日期"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.noChargeTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="customerDegree.cddValue"
                    label="月毛利区间"
                    align="center"
                    width="180">
            </el-table-column>
            <el-table-column
                    label="主联系人"
                    align="center"
                    width="180">
              <template slot-scope="scope">
                {{scope.row.contactName}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="contactMobile"
                    label="联系方式"
                    align="center"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="customerState.cddValue"
                    label="客户状态"
                    width="100"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="预计成交日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.transactionEndTime*1000 | formatCreateTime}}
              </template>
            </el-table-column>
            <el-table-column
                    prop="lastOrderTime"
                    label="最近成交时间"
                    width="150"
                    align="center">
            </el-table-column>
            <el-table-column
                    label="客户分类"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerType">
                     {{scope.row.customerType.cddValue}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户行业"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                 <span v-if="scope.row.customerIndustry">
                      {{scope.row.customerIndustry.cddValue}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户来源"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.customerSource">
                      {{scope.row.customerSource.cddValue}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="客户类型"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.customerSource">
                      {{scope.row.profitType | fifprofitType}}
                 </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    width="150"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createdAt}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    width="100"
                    align="center">
              <template slot-scope="scope">
                  <span v-if="scope.row.creator">
                      {{scope.row.creator.realName}}
                 </span>

              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="250"
                    align="center">
              <template slot-scope="scope">
                <el-button
                        type="text"
                        size="mini"
                        @click="toAddCustomer('see',scope.row)">查看
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showSetLabel(scope.row)">采购评级
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showSetClass(scope.row)">客户类型
                </el-button>
                <el-button
                        type="text"
                        size="mini"
                        @click="showQuit(scope.row)">转移
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>

        <div style="width:300px;float:left;margin-top:20px">
<!--          <el-button @click="showDel('')" size="small" v-if="listQuery.tab == 'my' || (listQuery.tab == 'company' && isCustomerDel) || (listQuery.tab == 'public' && isCustomerDel)">-->
<!--            批量删除-->
<!--          </el-button>-->
<!--          <el-button-->
<!--                  size="small"-->
<!--                  @click="showQuit"-->
<!--                  v-if="listQuery.tab == 'public' && isCustomerMove">-->
<!--            批量转移-->
<!--          </el-button>-->
        </div>
        <div class="pagination-container">
          <el-pagination
                  background
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  layout="total, sizes,prev, pager, next,jumper"
                  :current-page.sync="listQuery.pageNum"
                  :page-size="listQuery.pageSize"
                  :page-sizes="[10,15,20]"
                  :total="count">
          </el-pagination>
        </div>
      </div>

      <!--客户查询-->
      <div v-if="!listQuery.tab">
        <div class="table-container">
          <el-table
                  v-loading="listLoading"
                  :data="tableData"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column type="selection" width="60" align="center"></el-table-column>
            <el-table-column  align="center" label="ID" prop="customerId" width="80"></el-table-column>
            <el-table-column label="公司名称">
              <template slot-scope="scope">
                <span>
                  {{scope.row.customerName}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
                    label="负责人"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.charge.realName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建日期"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createdAt}}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建人"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.creator.realName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="最近跟进日期"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.lastTrackingTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="最新成交日期"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.lastOrderTime}}
              </template>
            </el-table-column>
            <el-table-column
                    label="最新成交业务员"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.lastOrderUserName}}
              </template>
            </el-table-column>
            <el-table-column
                    label="客户类别"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.typeList | fifTypeList}}
              </template>
            </el-table-column>
          </el-table>
        </div>
<!--        <div class="pagination-container">-->
<!--          <el-pagination-->
<!--                  background-->
<!--                  @size-change="handleSizeChange"-->
<!--                  @current-change="handleCurrentChange"-->
<!--                  layout="total, sizes,prev, pager, next,jumper"-->
<!--                  :current-page.sync="listQuery.pageNum"-->
<!--                  :page-size="listQuery.pageSize"-->
<!--                  :page-sizes="[10,15,20]"-->
<!--                  :total="count">-->
<!--          </el-pagination>-->
<!--        </div>-->
      </div>

    <!--新增/编辑客户-->
    <el-dialog
      :close-on-click-modal="false"
      :title="title"
      :beforeClose="beforeClose"
      :visible.sync="dialogVisible"
      width="600px">
      <el-form :model="customerForm" size="mini" label-width="140px" :rules="rules" ref="customerForm">
        <el-form-item label="统一社会信用代码：" prop="businessCode">
          <el-input v-model="customerForm.businessCode" @blur="seachRepeat" :disabled="dialogType=='see'"></el-input>
        </el-form-item>
        <el-form-item label="客户名称：" prop="customerName">
          <el-input v-model="customerForm.customerName" :disabled="dialogType=='see'"></el-input>
        </el-form-item>

        <el-form-item label="主联系人：" prop="contactName">
          <el-input v-model="customerForm.contactName" style="width:150px" :disabled="dialogType=='see'"></el-input>
        </el-form-item>
        <el-form-item label="主联系电话：" prop="contactMobile">
          <el-input v-model="customerForm.contactMobile" style="width:150px" :disabled="dialogType=='see'" @blur="seachRepeat2"></el-input>
        </el-form-item>
        <el-form-item label="是否有采购决定权：" prop="isBuyPermission">
          <el-radio-group v-model="customerForm.isBuyPermission" :disabled="dialogType == 'see'">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="主联系人职位：" prop="contactDuty">
          <el-input v-model="customerForm.contactDuty" style="width:150px" :disabled="dialogType=='see'"></el-input>
        </el-form-item>
        <el-form-item label="客户行业：" prop="customerIndustry" >
            <el-select v-model="customerForm.customerIndustry" :disabled="dialogType=='see'">
              <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerIndustryList"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="客户状态：" prop="customerState" >
          <el-select v-model="customerForm.customerState" :disabled="dialogType=='see'">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerStateList"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户分类：" prop="customerType">
          <el-select v-model="customerForm.customerType" :disabled="dialogType=='see'">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerTypeList"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户来源：" prop="customerSource">
          <el-select  v-model="customerForm.customerSource" :disabled="dialogType=='see'">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerSourceList"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="月毛利区间：" prop="customerDegree">
          <el-select  v-model="customerForm.customerDegree" :disabled="dialogType=='see'">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerDegreeList"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户性质：" prop="customerQuality">
          <el-select v-model="customerForm.customerQuality" :disabled="dialogType=='see'">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in customerQualityList"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="预计成交日期：" prop="transactionTime">
          <el-select v-model="customerForm.transactionTime" :disabled="dialogType=='see' || (dialogType == 'edit' && customerForm.transactionEndTime!=0)">
            <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in closingTimeList"></el-option>
          </el-select>
        </el-form-item>
        <div style="margin:20px 0;font-weight: bold;cursor: pointer" @click="isShowMore = !isShowMore">更多信息 <i :class="{'el-icon-caret-bottom':!isShowMore,'el-icon-caret-top':isShowMore}"></i></div>
        <div v-if="isShowMore">
          <el-form-item label="创建人："  >
              {{creator}}
          </el-form-item>
            <el-form-item label="负责人：">
              <el-select v-model="customerForm.chargeId" filterable placeholder="请选择" clearable :disabled="dialogType=='see'|| dialogType=='edit'">
                <el-option
                  v-for="item in userOptionList"
                  :key="item.userId"
                  :label="item.realName"
                  :value="item.userId">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="协助人（可多选）：" >
              <el-select  v-model="customerForm.assistIds" filterable placeholder="请选择" clearable multiple :disabled="dialogType=='see'">
                  <el-option
                    v-for="item in assistList"
                    :key="item.userId"
                    :label="item.realName"
                    :value="item.userId">
                  </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="所在地区："  v-model="diQuIds" prop="diQuIds">
              <el-cascader
                :disabled="dialogType=='see'"
                v-model="diQuIds"
                :props="{ value: 'areaId',label:'areaName',children:'areaChildList' }"
                :options="options"></el-cascader>
            </el-form-item>
            <el-form-item label=" 详细地址：" prop="addressDetail">
              <el-input v-model="customerForm.addressDetail" :disabled="dialogType=='see'"></el-input>
            </el-form-item>
            <el-form-item label=" 公司网址：" >
              <el-input v-model="customerForm.customerUrl" :disabled="dialogType=='see'"></el-input>
            </el-form-item>
            <el-form-item label=" 公司简介：" prop="customerDetail">
              <el-input v-model="customerForm.customerDetail" :autosize="{ minRows: 2, maxRows: 6}" type="textarea" :rows="2" :disabled="dialogType=='see'"></el-input>
            </el-form-item>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer" v-if="dialogType!='see'">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" @click="handleConfirm" :loading="btnLoading" >确定</el-button>
      </span>
      <span slot="footer" class="dialog-footer" v-else>
          <el-button @click="handleClose">关 闭</el-button>
      </span>
    </el-dialog>

    <!--客户转移-->
    <el-dialog
            :close-on-click-modal="false"
      title="客户转移"
      :visible.sync="dialogVisible3"
      width="420px">
      <el-form :model="quitForm" size="mini" label-width="140px" ref="quitForm"  :rules="quitRules">
        <el-form-item label="将所有关联客户转到：">
          <el-select v-model="quitForm.target" filterable placeholder="请选择">
            <el-option
              v-if="listQuery.tab!='public'"
              :key="0"
              label="公海"
              :value="0">
            </el-option>
<!--            <el-option-->
<!--              :key="999999"-->
<!--              label="资源池"-->
<!--              :value="999999">-->
<!--            </el-option>-->
            <el-option
              v-if="listQuery.tab=='company' || listQuery.tab=='public' || listQuery.tab=='dept'"
              v-for="item in list2"
              :key="item.userId"
              :label="item.realName"
              :value="item.userId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注：" prop="remark">
          <el-input v-model="quitForm.remark" :autosize="{ minRows: 2, maxRows: 6}" type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <div v-if="quitForm.target === 0" style="font-size:12px;color:red">
        公海池： 客户使用塑料原料，未使用公司主营塑料原料
      </div>
      <div v-if="quitForm.target === 999999" style="font-size:12px;color:red;line-height: 20px">
        资源池： 客户用到我们的主营品种PA,PC,ABS.PBT.BPA<br/>
        ①业务员在跟进进阶上因为个人原因有很大的困难<br/>
        ②贸易客户，不想多花时间跟进<br/>
        ③微小客户，不想花时间跟进<br/>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose3">取 消</el-button>
          <el-button type="primary" @click="handleConfirm3" :loading="btnLoading3">确 定</el-button>
      </span>
    </el-dialog>

    <!--客户删除-->
    <el-dialog
            :close-on-click-modal="false"
            title="客户删除"
            :visible.sync="dialogVisible4"
            width="420px">
      <div style="font-size:14px;padding-bottom:20px;">确认删除客户？</div>
      <el-form :model="delForm" size="mini" label-width="120px" ref="delForm" :rules="rules4">
        <el-form-item label="删除理由：" prop="remark">
            <el-input v-model="delForm.remark" :autosize="{ minRows: 2, maxRows: 6}" type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose4">取 消</el-button>
          <el-button type="primary" @click="handleConfirm4" :loading="btnLoading4">确 定</el-button>
      </span>
    </el-dialog>
    <!--批量导入-->
    <el-dialog
      :show-close="showClose"
      :close-on-click-modal="showClose"
      :close-on-press-escape="showClose"
      :title="poptitle"
      :beforeClose="beforeCloseEditPrice"
      :visible.sync="dialogVisibleImprot"
      width="500px">
      <div>
        <el-alert
          title="请先下载模板，维护后，再上传更新后的模板文件"
          type="warning"
          :closable="false">
        </el-alert>
        <div style="text-align: center;padding:20px;padding-bottom:10px">
          <el-link :href="url" type="primary" :underline="false">下载模板</el-link>
        </div>
        <div class="upload-div">
          <input id="upload" type="file" @change="importfxx(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
          <el-button type="primary" size="small" :loading="uploadLoading">选择上传文件</el-button>
        </div>
        <div style="margin:20px auto;margin-bottom:0;word-break:break-all;text-align: left;line-height:20px;background: #fef0f0;color:#f56c6c;padding:10px" v-if="msg!=''">
          <div style="max-height: 90px;overflow: auto;padding:10px"><div v-if="showFial">添加失败：</div>{{msg}}</div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleEditPriceConfirm" :loading="EditLoading">提 交</el-button>
      </span>
    </el-dialog>

    <!--设置采购评级-->
    <el-dialog
            :before-close="handleClose5"
            :close-on-click-modal="false"
            title="设置采购评级"
            :visible.sync="dialogVisible5"
            width="420px">
      <el-form :model="labelForm" size="mini" label-width="120px" ref="labelForm">
        <el-form-item label="采购评级：">
          <el-select v-model="labelForm.customerLabel" filterable placeholder="请选择">
            <el-option
                    key="A类"
                    label="A类   长期合作，信誉良好，同等价格优先选择我们，每月稳定拿货，毛利100元/吨以上。"
                    value="A类">
            </el-option>
            <el-option
                    key="B类"
                    label="B类   根据经营情况拿货，实体工厂，通过努力可以发展成A类客户。"
                    value="B类">
            </el-option>
            <el-option
                    key="C类"
                    label="C类   看重价格，采购量波动大。"
                    value="C类">
            </el-option>
            <el-option
                    key="D类"
                    label="D类  缺乏感恩之心，有过违约行为（3个月后再进行评定）。"
                    value="D类">
            </el-option>
            <el-option
                    key="类"
                    label="E类   新客户（根据其与以前供应商合作情况对比，可以确定的放入对应等级，直接放入对应等级，暂时无法评定的放入E级）。"
                    value="E类">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose5">取 消</el-button>
          <el-button type="primary" @click="handleConfirm5" :loading="btnLoading5">确 定</el-button>
      </span>
    </el-dialog>

    <!--产品线导入-->
    <el-dialog
            :show-close="showClose2"
            :close-on-click-modal="showClose2"
            :close-on-press-escape="showClose2"
            title="批量更新产品线负责人"
            :beforeClose="beforeCloseEditPrice2"
            :visible.sync="dialogVisibleImprot2"
            width="500px">
      <div>
        <el-alert
                title="请先导出产品线负责人列表，维护后，再上传更新后的文件"
                type="warning"
                :closable="false">
        </el-alert>
        <div style="text-align: center;padding:20px;padding-bottom:10px">
          <el-button type="text" size="small" :loading="downLoading" @click="downloadExcel2">导出产品线负责人列表</el-button>
        </div>
        <div class="upload-div">
          <input id="upload" type="file" @change="importfxx(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
          <el-button type="primary" size="small" :loading="uploadLoading">选择上传文件</el-button>
        </div>
        <div style="margin:20px auto;margin-bottom:0;word-break:break-all;text-align: left;line-height:20px;background: #fef0f0;color:#f56c6c;padding:10px" v-if="msg2!=''">
          <div style="max-height: 90px;overflow: auto;padding:10px"><div v-if="showFial2">添加失败：</div>{{msg2}}</div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleEditPriceConfirm2" :loading="EditLoading2">提 交</el-button>
      </span>
    </el-dialog>


    <!--客户审核 -->
    <el-dialog
            :close-on-click-modal="false"
            title="确认操作"
            :visible.sync="dialogVisible16"
            width="420px">
      <div style="font-size:14px;padding-bottom:20px;">确认审核通过此操作？</div>
      <span slot="footer" class="dialog-footer">
          <el-button @click="passItemPass(0,null)">审核不通过</el-button>
<!--          <el-button @click="moveItem">{{passItem.checkType == 'blackList' ? '加入回收站' : '加入公海'}}</el-button>-->
          <el-button type="primary" @click="passItemPass(1,null)">审核通过</el-button>
      </span>
    </el-dialog>

    <!--客户类型-->
    <el-dialog
            :close-on-click-modal="false"
            title="客户类型"
            :visible.sync="dialogVisible17"
            width="420px">
      <div style="font-size:14px;padding-bottom:20px;">
        <el-form :inline="true" :model="customerClassForm" size="mini" label-width="120px">
          <el-form-item label="客户类型：">
            <el-select v-model="customerClassForm.profitType" placeholder="请选择">
                <el-option key="develop" label="开发客户" value="develop"></el-option>
                <el-option key="move" label="流转客户" value="move"></el-option>
            </el-select>
          </el-form-item>
        </el-form>

      </div>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose17">取 消</el-button>
          <el-button type="primary" @click="handleConfirm17" :loading="btnLoading17">确 定</el-button>
      </span>
    </el-dialog>

    <!--客户潜在等级-->
    <el-dialog
            :close-on-click-modal="false"
            title="客户潜在等级修改"
            :visible.sync="dialogVisible18"
            width="420px">
      <el-form :model="dengjiForm" size="mini" label-width="120px" ref="dengjiForm"  :rules="rules18">
        <el-form-item label="潜在等级：" prop="customerPotentialId">
          <el-select v-model.number="dengjiForm.customerPotentialId" class="input-width" style="width:195px" placeholder="请选择" clearable >
            <el-option
                    v-for="item in customerPotentialList"
                    :key="item.customerPotentialId"
                    :label="item.customerPotentialValue"
                    :value="item.customerPotentialId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="原因：" prop="potentialReason">
          <el-input v-model="dengjiForm.potentialReason" :autosize="{ minRows: 2, maxRows: 6}" type="textarea"></el-input>
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose18">取 消</el-button>
          <el-button type="primary" @click="handleConfirm18" :loading="btnLoading18">确 定</el-button>
      </span>
    </el-dialog>

    <!--修改客户未成交原因-->
    <el-dialog
            :close-on-click-modal="false"
            title="修改客户未成交原因"
            :visible.sync="dialogVisible19"
            width="900px">
      <el-form :model="nodealiForm" size="mini" label-width="100px" ref="nodealiForm"  :rules="rules19" inline>
        <el-form-item label="客户名称：">
           {{nodealiForm.customerName}}
        </el-form-item>
        <el-form-item label="上次成交时间：" >
          {{nodealiForm.lastOrderTime}}
        </el-form-item>
        <el-table
                :data="nodealiForm.table"
                border
                style="width: 100%;">
          <el-table-column label="未成交原因"  align="center">
            <template slot-scope="scope">
              <el-form-item :prop="`table.${scope.$index}.reasonId`" :rules="rules19.reasonId">
                <el-select v-model="scope.row.reasonId" class="input-width" style="width:350px" placeholder="请选择"  @change="changeUnOrderReason(scope.$index)">
                  <el-option
                          v-for="item in secUnOrderSolutionsList"
                          :key="item.reasonId"
                          :label="item.reasonValue"
                          :value="item.reasonId">
                  </el-option>
                </el-select>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="未成交对策"  align="center">
            <template slot-scope="scope">
              <el-form-item :prop="`table.${scope.$index}.solutionIds`" :rules="rules19.solutionIds">
                <el-select v-model="scope.row.solutionIds" class="input-width" style="width:350px" placeholder="请选择"  multiple>
                  <el-option
                          v-for="item in scope.row.solutionList"
                          :key="item.solutionId"
                          :label="item.solutionValue"
                          :value="item.solutionId">
                  </el-option>
                </el-select>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="操作"  align="center" width="100">
            <template slot-scope="scope">
                 <el-button type="text" @click="delTable(scope.$index)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div>
            <el-button type="text" size="small" @click="addTableItem">+ 增加原因及对策</el-button>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose19">取 消</el-button>
          <el-button type="primary" @click="handleConfirm19" :loading="btnLoading19">确 定</el-button>
      </span>
    </el-dialog>


    <!--批量导入未成交-->
    <el-dialog
          :show-close="showClose3"
          :close-on-click-modal="showClose3"
          :close-on-press-escape="showClose3"
          title="导入未成交原因/对策"
          :beforeClose="beforeCloseEditPrice3"
          :visible.sync="dialogVisibleImprot3"
          width="500px">
    <div>
      <el-alert
              title="请先导出未成交原因/对策模板，维护后，再上传更新后的文件"
              type="warning"
              :closable="false">
      </el-alert>
      <div style="text-align: center;padding:20px;padding-bottom:10px">
        <el-button type="text" size="small" :loading="downLoading3" @click="downloadExcel3">导出未成交原因/对策</el-button>
      </div>
      <div class="upload-div">
        <input id="upload" type="file" @change="importfxx(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
        <el-button type="primary" size="small" :loading="uploadLoading">选择上传文件</el-button>
      </div>
      <div style="margin:20px auto;margin-bottom:0;word-break:break-all;text-align: left;line-height:20px;background: #fef0f0;color:#f56c6c;padding:10px" v-if="msg3!=''">
        <div style="max-height: 90px;overflow: auto;padding:10px"><div v-if="showFial2">添加失败：</div>{{msg3}}</div>
      </div>
    </div>
    <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleEditPriceConfirm3" :loading="EditLoading3">提 交</el-button>
      </span>
  </el-dialog>

    <!--全部导出弹窗-->
    <el-dialog
            :close-on-click-modal="false"
            title="导出字段选择"
            :visible.sync="dialogVisible20"
            width="800px">
      <div>
        <el-form :model="exportForm" size="mini" label-width="100px" ref="exportForm"  :rules="rules20">
           <el-form-item label="导出字段：" prop="checkList">
             <el-checkbox-group v-model="exportForm.checkList">
               <el-checkbox :label="item.key" v-for="item in exportFields" :key="item.key">{{item.value}}</el-checkbox>
             </el-checkbox-group>
           </el-form-item>
          <el-form-item label="客户类别：" prop="type">
            <el-radio-group v-model="exportForm.type">
              <el-radio :label="1">全部客户</el-radio>
              <el-radio :label="2">已成交客户</el-radio>
              <el-radio :label="3">主客户</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-form>

      </div>
      <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="downloadExcel20" :loading="btnLoading20">确认导出</el-button>
      </span>
    </el-dialog>


    <!--申请授信弹窗-->
    <el-dialog
      :close-on-click-modal="false"
      title="申请授信"
      :visible.sync="dialogVisibleShouXing"
      width="800px">
      <div>
         <el-form>
            <el-form-item label="上传附件">
              <el-upload action="https://upload.qiniup.com"
                         style="width:500px"
                         :http-request="sliderRequest"
                         :limit="1"
                         :on-exceed="onExceed"
                         list-type="picture"
                         :file-list="fileList"
                         :before-remove="beforeRemove"
                         :on-remove="onRemove"
                         :on-preview="preview">
                <el-button size="small" type="primary" :disabled="fileList.length>=1">点击上传</el-button>
              </el-upload>
            </el-form-item>
         </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitShouXing" :loading="btnLoadingShouXing">确认</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
    import {partnerList,
      customerWaitCheck,
      customerCheck,
      exportListExcel,
      batchUpdateGoodsLine,
      customerPotential,
      getCustomerOption,
      getCustomerSetting,
      exportGoodsLine,
      ajaxEditDengji,
      getUserOption,getAddressList,updateCustomers,
      setUnOrderReason,
      unOrderSolutions,
      unOrderCustomersImport,
      getExportFields,
      getExportData,
      getQiniuToken,
      changeCustomerShouXing,
      getCustomersInfo,exportCustomers,setCustomerMove,importCustomer,checkBusinessCode,assistAPI,checkContactMobile,delCustomer,myDeptList,getCompanyInfo,getBlackList,operateBlackList,customersAjaxEdit,unOrderCustomers,customerNeverDel,customersMyCharge,getRelationList,importBatchMove} from '@/api/partner'
    import {getStaffsList} from '@/api/management'
    import {formatDate} from '@/utils/date';
    import {validatePhone} from '@/utils/validate';
    import { getToken } from '@/utils/auth'
    import store from '@/store'
    import { mapGetters } from 'vuex'
    import axios from "axios";
    const defaultCustomerForm = {
        customerState:null,
        customerType:null,
        customerIndustry:null,
        customerSource:null,
        customerQuality:null,
        customerDegree:null,
        customerName:null,
        contactName:null,
        contactMobile:null,
        assistIds:null,
        chargeId:null,
        provinceId:null,
        cityId:null,
        areaId:null,
        addressDetail:null,
        customerUrl:null,
        customerDetail:null,
        transactionTime:null,
        businessCode:null,
        contactDuty:null,
        isBuyPermission:null,
    };
    const defaultListQuery={
      pageNum: 1,
      pageSize: 10,
      keyword: '',
      chargeId:'',
      createrId:'',
      customerState:null,
      customerType:null,
      customerSource:null,
      customerQuality:null,
      customerDegree:null,
      customerTracking:null,
      transactionTime:null,
      trackingTime:'',
      createdAt:'',
      updatedAt:'',
      isChina:'',
      hasOne: 0,
      tab:'my',
      departmentId:null,
      businessCode:null,
      customerGrade:null,
      customerLabel:null,
      diQuIds:[],
      hasBusinessCode:'',
      customerPotential:[],
      typeList:[],
      customerName:'',
      profitType:'',
      lastOrderTime:[],
      categoryName:'',
      goodsName:'',
      trackingContent:'',
      goodsLineId:''
    };
    const nodealiFormTable = {
        reasonId:'',
        reasonValue:'',
        solutionIds:[],
        solutionList:[],
    };
    const defaultExportForm = {
      checkList:[],
      type:''
    }
    export default {
      name: "index",
      data(){
          const isvalidatePhone = (rule, value, callback) => {
              if(!validatePhone(value)){
                  callback(new Error('请输入正确的手机号'))
              } else {
                  callback()
              }
          };
          const isdiQuIds = (rule, value, callback) => {
            if(!this.diQuIds.length){
              callback(new Error('请选择所在地区'))
            } else {
              callback()
            }
          };
          return {
              activeIndex: '1',
              creator:'',
              listQuery: JSON.parse(JSON.stringify(defaultListQuery)),
              time: '',
              tableData: [],
              count: 0,
              listLoading: false,
              customerOptionList: [],
              customerStateList: [],
              customerTypeList: [],
              customerTrackingList: [],
              customerSourceList: [],
              customerQualityList: [],
              customerDegreeList: [],
              customerIndustryList:[],
              userOptionList:[],
              roles:store.getters.roles ? store.getters.roles : [],
              dialogVisible:false,
              title:'',
              customerForm:JSON.parse(JSON.stringify(defaultCustomerForm)),
              rules:{
                  businessCode:[{required: true, message: '请输入社会统一信用码', trigger: 'blur'},],
                  customerName:[{required: true, message: '请输入客户名称', trigger: 'blur'}],
                  contactName:[{required: true, message: '请输入主联系人', trigger: 'blur'}],
                  contactMobile:[{required: true, message: '请输入联系电话', trigger: 'blur'},],
                  customerIndustry:[{required: true, message: '请选择客户行业', trigger: 'change'},],
                  customerState:[{required: true, message: '请选择客户状态', trigger: 'change'},],
                  customerType:[{required: true, message: '请选择客户分类', trigger: 'change'},],
                  customerSource:[{required: true, message: '请选择客户来源', trigger: 'change'},],
                  customerDegree:[{required: true, message: '请选择重要程度', trigger: 'change'},],
                  customerQuality:[{required: true, message: '请选择客户性质', trigger: 'change'},],
                  transactionTime:[{required: true, message: '请选择预计成交日期', trigger: 'change'},],
                  contactDuty:[{required: true, message: '请输入主要联系人职位', trigger: 'blur'},],
                  diQuIds:[{required: true,validator:isdiQuIds, trigger: 'change'},],
                  addressDetail:[{required: true, message: '请输入详细地址', trigger: 'blur'},],
                  customerDetail:[{required: true, message: '请输入公司简介', trigger: 'blur'}],
                  isBuyPermission:[{required: true, message: '请选择采购决定权', trigger: 'change'}]
              },
              btnLoading:false,
              isShowMore:true,
              options:[],
              diQuIds:[],
              dialogVisible3:false,
              quitForm:{
                  target:'',
                  remark:'',
              },
              list2:[],
              btnLoading3:false,
              multipleSelection:[],
              showClose:true,
              da:[],
              file:null,
              dialogVisibleImprot:false,//批量导入弹窗
              EditLoading:false,//批量导入提交按钮loadin
              showFial:false,//批量导入失败
              msg:'',//上传文件信息
              url:'',
              uploadLoading:false,
              token:'',
              closingTimeList:[],
              dialogType:'',//弹窗类型
              assistList:[],
              deptList:[],
              dialogVisible4:false,
              btnLoading4:false,
              delForm:{
                  remark:''
              },
            rules4:{
              remark:[{required: true, message: '请输入删除理由', trigger: 'blur'},],
            },
            quitRules:{
              remark:[{required: true, message: '请输入转移备注', trigger: 'blur'},],
            },
            dialogVisible5:false,
            labelForm:{
              customerLabel:'',
              customerId:'',
            },
            btnLoading5:false,
            customerPotentialList:[],
            customerLeiBie:[
              {id:'normal',name:'正常'},
              {id:'noCharge',name:'公海'},
              {id:'isBlackList',name:'黑名单'},
              {id:'isDelete',name:'回收站'},
              {id:'isBlackListApply',name:'黑名单待审'},
              {id:'isDeleteApply',name:'回收站待审'},
              {id:'outNoCharge',name:'领取客户待审'},
              {id:'moveCharge',name:'转移客户待审核'},
            ],
            removerType:[
              {id:1,name:'按公司名称'},
              {id:2,name:'按联系人手机号'},
              {id:3,name:'按统一组织信用码'},
            ],
            showClose2:true,
            dialogVisibleImprot2:false,//批量导入弹窗
            EditLoading2:false,//批量导入提交按钮loadin
            showFial2:false,//批量导入失败
            msg2:'',//上传文件信息
            downLoading:false,
            dialogVisible16:false,
            btnLoading16:false,
            passItem:{},
            dialogVisible17:false,
            btnLoading17:false,
            customerClassForm:{profitType:'',customerId:''},
            itemQuit:{},
            tableData1:[],
            tableData2:[],
            tableData3:[],
            tableData4:[],
            tableData5:[],
            tableData6:[],
            areaId1:'',
            areaId2:'',
            areaId3:'',
            areaIndex1:null,
            areaIndex2:null,
            sort:null,
            hasCustomerType:null,
            btnLoading9:false,
            hasAgreement:null,

            dialogVisible18:false,
            btnLoading18:false,
            dengjiForm:{
              customerId:'',
              customerPotentialId:'',
              potentialReason:''
            },
            rules18:{
              customerPotentialId:[{required: true, message: '请选择潜在等级', trigger: 'change'},],
              potentialReason:[{required: true, message: '请输入修改潜在等级理由', trigger: 'blur'},],
            },

            dialogVisible19:false,
            btnLoading19:false,
            nodealiForm:{
              customerId:'',
              customerName:'',
              lastOrderTime:'',
              table:[],
            },
            rules19:{
              reasonId:[{required: true, message: '请选择未成交原因', trigger: 'change'},],
              solutionIds:[{required: true, message: '请选择未成交对策', trigger: 'change'},],
            },
            dayNum:15,
            unOrderReasonlist:[],
            unOrderSolutionslist:[],
            otherUnOrderReason:false,
            otherUnOrderSolutions:false,
            unOrderReasonId:'',

            showClose3:true,
            dialogVisibleImprot3:false,//批量导入未成交弹窗
            EditLoading3:false,//批量导入未成交提交按钮loadin
            showFial3:false,//批量导入未成交失败
            msg3:'',//上传未成交文件信息
            downLoading3:false,
            secUnOrderSolutionsList:[],
            solutionList:[],
            dialogVisible20:false,
            btnLoading20:false,
            exportForm:JSON.parse(JSON.stringify(defaultExportForm)),
            exportFields:[],
            rules20:{
              checkList:[{required: true, message: '请选择导出字段', trigger: 'change'},],
              type:[{required: true, message: '请选择导出客户类型', trigger: 'change'},],
            },

            dialogVisibleShouXing:false,
            btnLoadingShouXing:false,
            fileList:[],
            uploadToken:{
              token:'',
            },
            imgDomain:'',
            showXingCustomerId : '',
            poptitle:'',
            importType:'',
            isMainCustomer:'',
            goodsLineList:[]
          }
      },
      computed: {
        ...mapGetters([
          'name',
          'mobile',
          'userId'
        ]),
        customerCheck(){
          if(this.roles.indexOf("customerCheck") != -1){
            return true
          }else{
            return false
          }
        },
        unOrdercustomer(){
          if(this.roles.indexOf("unOrdercustomer") != -1){
            return true
          }else{
            return false
          }
        },
          isCanCustomerByAdd() {
              if(this.roles.indexOf("customerByAdd") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCanCustomerByEdit(){
              if(this.roles.indexOf("customerByEdit") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCanCustomerByImport(){
              if(this.roles.indexOf("customerByImport") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCustomerMove(){
              if(this.roles.indexOf("customerMove") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCustomerDel(){
            if(this.roles.indexOf("customerDel") != -1){
              return true
            }else{
              return false
            }
          },
          isCanCustomerByGHC(){
              if(this.roles.indexOf("customerByGHC") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCanCustomerByDept(){
              if(this.roles.indexOf("customerByDept") != -1){
                  return true
              }else{
                  return false
              }
          },
          isCanCustomerByAll(){
              if(this.roles.indexOf("customerByAll") != -1){
                  return true
              }else{
                  return false
              }
          },
        customerByAllExport(){
          if(this.roles.indexOf("customerByAllExport") != -1){
            return true
          }else{
            return false
          }
        },
        productLineBatchUpdate(){
          if(this.roles.indexOf("productLineBatchUpdate") != -1){
            return true
          }else{
            return false
          }
        },
        relationCustomer(){
          if(this.roles.indexOf("relationCustomer") != -1){
            return true
          }else{
            return false
          }
        },
        exportRelationCustomer(){
          if(this.roles.indexOf("exportRelationCustomer") != -1){
            return true
          }else{
            return false
          }
        },
        unOrderSolutions(){
          if(this.roles.indexOf("unOrderSolutions") != -1){
            return true
          }else{
            return false
          }
        },

        yunLinkCustomerConfirm(){
          if(this.roles.indexOf("yunLinkCustomerConfirm") != -1){
            return true
          }else{
            return false
          }
        },
      },
      created() {
        if (localStorage.getItem('customerListQuery')){
          this.listQuery = JSON.parse(localStorage.getItem('customerListQuery'));
          localStorage.removeItem('customerListQuery');
        }
        if (localStorage.getItem('customerListQuery2')){
          let customerListQuery2 = JSON.parse(localStorage.getItem('customerListQuery2'));
          this.areaId1 = customerListQuery2.areaId1;
          this.areaId2 = customerListQuery2.areaId2;
          this.areaId3 = customerListQuery2.areaId3;
          this.areaIndex1 = customerListQuery2.areaIndex1;
          this.areaIndex2 = customerListQuery2.areaIndex2;
          this.sort = customerListQuery2.sort;
          this.hasCustomerType = customerListQuery2.hasCustomerType;
          this.hasAgreement = customerListQuery2.hasAgreement;
          this.options = customerListQuery2.options;
          localStorage.removeItem('customerListQuery2');
        }
        if(this.$route.query.type){
          switch (this.$route.query.type) {
            case 'my':
              this.listQuery.tab = 'my';
              break;
            case 'myDay':
              this.listQuery.tab = 'my';
              this.listQuery.createdAt = [formatDate(new Date(), 'yyyy-MM-dd'),formatDate(new Date(), 'yyyy-MM-dd')];
              break;
            case 'dept':
              this.listQuery.tab = 'dept';
              break;
            case 'deptDay':
              this.listQuery.tab = 'dept';
              this.listQuery.createdAt = [formatDate(new Date(), 'yyyy-MM-dd'),formatDate(new Date(), 'yyyy-MM-dd')];
              break;
            case 'company':
              this.listQuery.tab = 'company';
              break;
            case 'companyDay':
              this.listQuery.tab = 'company';
              this.listQuery.createdAt = [formatDate(new Date(), 'yyyy-MM-dd'),formatDate(new Date(), 'yyyy-MM-dd')];
              break;
          }
        }
        this.getUserList();
        this.getUserOptionList();
        this.getCustomerSettingList();
        this.getAddressListData();
        this.getAssistList();
        this.token = getToken();
        this.url = '/api/customers/template/download?token=' + this.token;
        this.getDeptList();
        this.getCustomerPotential();
        this.getUnOrderSolutionsList();
        this.getFields();
        this.getUploadToken();
      },
      filters: {
        fiflist(list){
          let array = [];
          if(list){
            list.forEach((el)=>{
              array.push(el.solutionValue)
            });
            return array.join(",")
          }else{
            return ''
          }
        },
        fifprofitType(val){
          if(val == 'develop'){
            return  '开发客户'
          }else if(val == 'move'){
            return  '流转客户'
          }
        },
        fifTypeList(val){
          if(val == 'isBlackList'){
            return  '黑名单'
          }else if(val == 'isDelete'){
            return  '回收站'
          }else if(val == 'noCharge'){
            return  '公海'
          }else if(val == 'normal'){
            return  '正常'
          }else if(val == 'isBlackListApply'){
            return  '黑名单待审'
          }else if(val == 'isDeleteApply'){
            return  '回收站待审'
          }else if(val == 'outNoCharge'){
            return  '领取客户待审'
          }else if(val == 'moveCharge'){
            return  '转移客户待审核'
          }
        },
        formatCreateTime(time) {
          if(time){
            let date = new Date(time);
            return formatDate(date, 'yyyy-MM-dd hh:mm:ss')
          }else{
            return '--'
          }
        },
        fifunList(list,val){
          let textlist = [];
          if(list){
            list.forEach((el)=>{
              if(el.cddValue == '其它'){
                textlist.push(val)
              }else{
                textlist.push(el.cddValue)

              }
            })
            return  textlist.join(",")
          }else{
            return ''
          }
        },
        fifrelationCustomers(list){
          let textList = [];
          list.forEach((el)=>{
            textList.push(el.customerName)
          });
          return  textList.join(",")
        },
        filterIsChina(val){
          if(val== 2){
            return '外贸'
          } else if(val == 1){
            return '国内'
          }
        },
      },
      methods: {
        showApply(item){
              this.dialogVisibleShouXing = true;
              this.showXingCustomerId = item.customerId;
              this.fileList = [];
        },
        //提交授信申请
        submitShouXing(){
          let data = {};
          data.customerId = this.showXingCustomerId;
          data.yunLinkContractUrl = this.fileList[0] ? this.fileList[0]['url'] : '';
          data.isEnableYunLink = 1;
          changeCustomerShouXing(data).then(()=>{
              this.dialogVisibleShouXing = false;
              this.$message({
                message: '申请已提交',
                type: 'success'
              });
          })
        },
        //获取七牛TOKEN
        getUploadToken(){
          getQiniuToken().then((res)=>{
            this.uploadToken.token = res.token;
            this.imgDomain = res.domain
          })
        },
        //上传文件重写
        sliderRequest(upload) {
          // 文件上传自行处理上传
          // 创建FormData对象 添加相关上传参数
          const formData = new FormData()
          // 文件对象
          formData.append('file', upload.file)
          // key 文件名处理，这样的话七牛会识别文件时什么类型
          let timestamp=new Date().getTime();
          let fileName = timestamp + upload.file.name
          formData.append('key', fileName)
          // token
          formData.append('token', this.uploadToken.token)//这个postData,要在data数据里面进行定义的，，，我这里调接口使用的是vue的方式
          // 上传文件
          // onUploadProgress 查看axios文档 https://github.com/axios/axios
          axios.post("https://upload.qiniup.com", formData, {
            onUploadProgress: (event) => {
              // 监听上传进度
              event.percent = event.loaded / event.total * 100
              upload.onProgress(event)
            }
          }).then((response) => {
            console.log("response",response)
            if (response.status === 200) {
              let res = response.data;
              console.log(this.imgDomain+res.key);
              let newFile = this.imgDomain+res.key;
              this.fileList.push({name:newFile,url:newFile});
              console.log("this.fileList",this.fileList)


            }else{
              this.handleAvatarError()
            }
          }).catch((err) => {
            // 调用组件上传失败方法
            this.handleAvatarError()
          })
        },




        handleChange(file, fileList) {
          this.fileList = fileList.slice(-1);
        },
        preview(file){
          window.open(file.name)
        },

        beforeRemove(file, fileList){
          return this.$confirm('确定删除图片吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            console.log(fileList);
          }).catch(() => {
            reject(false);
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        },
        onRemove(file, fileList){
          this.fileList = fileList
        },
        onExceed(file, fileList){
          this.$message({
            message: '最多上传5个附件',
            type: 'error'
          });
        },


        //获取导出字段
        getFields(){
          getExportFields().then(response => {
            this.exportFields = response;
          })
        },
        //显示导出选择字段弹窗
        showExportPop(){
          this.dialogVisible20 = true;
          this.exportForm = JSON.parse(JSON.stringify(defaultExportForm));
          setTimeout(()=>{
            this.$refs.exportForm.clearValidate()
          },300)

        },
        //下载自定义导出
        downloadExcel20(){
          this.$refs.exportForm.validate((valid) => {
            if (valid) {
              let params = {};
              params.exportFields = this.exportForm.checkList.join(",");
              if(this.exportForm.type == 2){
                params.hasOrder = 1;
              }else if(this.exportForm.type == 3){
                params.mainCustomer = 1
                params.hasOrder = 0
              }
              this.btnLoading20 = true
              getExportData(params).then((res)=>{
                require.ensure([], () => {
                  const { export_json_to_excel } = require('sheet/Export2Excel');
                  const tHeader = res.title;
                  const filterVal = res.columns;
                  const list = res.list;
                  const data = this.formatJson(filterVal, list);
                  export_json_to_excel(tHeader, data, res.fileName);
                  this.dialogVisible20 = false;
                  this.btnLoading20 = false
                })
              }).catch(()=>{
                this.btnLoading20 = false
              })
            }
          });

        },

        //获取客户未成原因及对策列表
        getUnOrderSolutionsList() {
          unOrderSolutions().then(response => {
            this.secUnOrderSolutionsList = response;
          })
        },

        //去设置未成交原因及对策页
        toSetWeiChengJiao(){
          let routeData = this.$router.resolve({name:'setWeiChengJiao'});
          window.open(routeData.href);
        },

        //下载未成交原因
        downloadExcel3(){
          this.downLoading3 = true;
          let params = {};
          params.keyword = this.listQuery.keyword;
          params.chargeId = this.listQuery.chargeId;
          params.diQuIds = this.listQuery.diQuIds;
          params.dayNum = this.dayNum;
          params.unOrderReasonId = this.unOrderReasonId;
          params.isExport = 1;
          unOrderCustomers(params).then((res)=>{
            this.downLoading3 = false;
            require.ensure([], () => {
              const { export_json_to_excel } = require('sheet/Export2Excel');
              const tHeader = res.title;
              const filterVal = res.columns;
              const list = res.list;
              const data = this.formatJson(filterVal, list);
              export_json_to_excel(tHeader, data, res.fileName);
            })
          })
        },

        //显示批量导入未来成交原因弹窗
        showImport3(){
          this.showFial3 = false;
          this.EditLoading3 = false;
          this.uploadLoading = false;
          this.msg3 = '';
          this.dialogVisibleImprot3 = true;
        },
        //关闭批量导入未来成交原因弹窗
        beforeCloseEditPrice3(){
          $("#upload").val('');
          this.da = [];
          this.msg3 = '';
          this.dialogVisibleImprot3 = false;
        },


        //提交批量导入未来成交原因
        handleEditPriceConfirm3(){
          if (this.da.length == 0){
            this.$message({
              message: '上传数据为空',
              type: 'warning'
            });
            return false;
          }
          this.msg3= '后台处理中，请耐心等待……';
          this.showFial3 = false;
          this.EditLoading3 = true;
          this.showClose3 = false;
          unOrderCustomers({list:this.da,isImport:1}).then((res)=>{
            this.$message({
              message: '修改成功',
              type: 'success'
            });
            this.msg3 = '修改成功';
            this.EditLoading3 = false;
            this.dialogVisible3 = false;
            this.showClose3 = true;
            this.da = [];
            this.dialogVisibleImprot3 = false;
            $("#upload").val('');
            this.getUserList();
          }).catch((err)=>{
            this.msg3 = err.msg;
            this.showFial3 = true;
            this.EditLoading3 = false;
            $("#upload").val('');
            this.showClose3 = true;
          })
        },

        //切换未成交原因
        changeUnOrderReason(index){
          console.log("index",index)
          let cut = this.secUnOrderSolutionsList.find((el)=>{
            return el.reasonId == this.nodealiForm.table[index]['reasonId']
          });
          console.log(cut)
          let c = JSON.parse(JSON.stringify(this.nodealiForm.table[index]));
          c.solutionIds = [];
          c.solutionList = cut.children;
          this.nodealiForm.table.splice(index,1,c);
        },

        //切换未成交对策
        changeUnOrderSolutions(){
          this.otherUnOrderSolutions = false;
          this.nodealiForm.unOrderSolutionsList.forEach((el)=>{
            if(el.cddValue == '其它'){
              this.otherUnOrderSolutions = true;
            }
          })
        },

        //删除原因及对策
        delTable(index){
          this.nodealiForm.table.splice(index,1);
        },

        //新增未成交原因及对策
        addTableItem(){
          this.nodealiForm.table.push({reasonId:'',solutionIds:[],solutionList:[]})
        },
        //显示未成交客户修改弹窗
        showNodealiForm(item){
          this.dialogVisible19 = true;
          this.nodealiForm.customerId = item.customerId;
          this.nodealiForm.customerName = item.customerName;
          this.nodealiForm.lastOrderTime = item.lastOrderTime;
          this.nodealiForm.table  = [];
          item.unOrderReasonList.forEach((el,index)=>{
            let c = {};
            c.reasonId = el.reasonId;
            c.solutionIds = [];
            el.children.forEach((ee)=>{
               c.solutionIds.push(ee.solutionId)
            });
            let cut = this.secUnOrderSolutionsList.find((e)=>{
              return e.reasonId == el.reasonId;
            });
            c.solutionList = JSON.parse(JSON.stringify(cut.children));
            this.nodealiForm.table.splice(index,1,c)
          })
        },
        //关闭未成交客户修改弹窗
        handleClose19(){
          this.dialogVisible19 = false;
          this.btnLoading19 = false;
          this.nodealiForm.customerId = '';
          this.nodealiForm.customerName = '';
          this.nodealiForm.lastOrderTime = '';
          this.nodealiForm.unOrderReasonList = [];
          this.nodealiForm.unOrderSolutionsList = '';
        },

        //确认未成交客户修改
        handleConfirm19(){
          this.$refs.nodealiForm.validate((valid) => {
            if (valid) {
              let data = {};
              data.customerId = this.nodealiForm.customerId;
              data.unOrderReasonList = [];
              this.nodealiForm.table.forEach((el)=>{
                let list = [];
                el.solutionIds.forEach((ee)=>{
                   list.push({solutionId:ee})
                });
                data.unOrderReasonList.push({reasonId:el.reasonId,children:list})
              });
              setUnOrderReason(data).then((res)=>{
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                });
                this.btnLoading19 = false;
                this.handleClose19();
                this.getUserList();
              }).catch(()=>{
                this.btnLoading19 = false;
              })
            }
          })
        },

        //显示客户潜在等级弹窗
        showDengjiForm(item){
          this.dialogVisible18 = true;
          this.dengjiForm.customerId = item.customerId;
          this.dengjiForm.customerPotentialId = item.customerPotentialId;
          this.dengjiForm.potentialReason = ''
        },

        //关闭客户潜在等级弹窗
        handleClose18(){
          this.dialogVisible18 = false;
          this.btnLoading18 = false;
          this.dengjiForm.customerId = '';
          this.dengjiForm.customerPotentialId = '';
          this.dengjiForm.potentialReason = '';
        },

        //确认客户潜在等级
        handleConfirm18(){
          this.$refs.dengjiForm.validate((valid) => {
            if (valid) {
              ajaxEditDengji(this.dengjiForm).then((res)=>{
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                });
                this.btnLoading18 = false;
                this.handleClose18();
                this.getUserList();
              }).catch(()=>{
                this.btnLoading18 = false;
              })
            }
          })

        },

        //客户查询
        keywordSearch(){
          if((this.listQuery.keyword.length > 0 && this.listQuery.keyword.length < 4) || (this.listQuery.keyword.length == 0 && (this.listQuery.businessCode == '' || this.listQuery.businessCode == null)) ){
            this.$message({
              type: 'error',
              message: '最少输入4个字符!'
            });
            return false
          }
          this.handleSearchList();
        },

        //切换省
        changeAreaId1(item){
            this.areaIndex1 = this.options.findIndex((el)=>{
              return item == el.areaId
            });
            this.areaIndex2 = null;
            this.areaId2 = '';
            this.areaId3 = '';
        },

        //切换市
        changeAreaId2(item){
          this.areaIndex2 = this.options[this.areaIndex1]['areaChildList'].findIndex((el)=>{
            return item == el.areaId
          });
          console.log("ads",this.areaIndex2)
          this.areaId3 = '';
        },

        //显示客户类型弹窗
        showSetClass(item){
          this.dialogVisible17 = true;
          this.customerClassForm.customerId = item.customerId;
          this.customerClassForm.profitType = item.profitType
        },

        //关闭客户类型弹窗
        handleClose17(){
          this.dialogVisible17 = false;
          this.btnLoading17 = false;
          this.customerClassForm.customerId = '';
          this.customerClassForm.profitType = ''
        },

        //确认客户类型
        handleConfirm17(){

              customersAjaxEdit(this.customerClassForm).then((res)=>{
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                });
                this.btnLoading17 = false;
                this.handleClose17();
                this.getUserList();
              }).catch(()=>{
                this.btnLoading17 = false;
              })
        },

        //下载产品线负责人
        downloadExcel2(){
          let params = JSON.parse(JSON.stringify(this.listQuery));
          this.downLoading = true;
          exportGoodsLine(params).then((res)=>{
            this.downLoading = false;
            require.ensure([], () => {
              const { export_json_to_excel } = require('sheet/Export2Excel');
              const tHeader = res.title;
              const filterVal = res.columns;
              const list = res.list;
              const data = this.formatJson(filterVal, list);
              export_json_to_excel(tHeader, data, res.fileName);
            })
          })
        },


        //显示批量更新产品线弹窗
        showImport2(){
          this.showFial2 = false;
          this.EditLoading2 = false;
          this.uploadLoading = false;
          this.msg2 = '';
          this.dialogVisibleImprot2 = true;
        },
        //关闭批量更新产品线弹窗
        beforeCloseEditPrice2(){
          $("#upload").val('');
          this.da = [];
          this.msg2 = '';
          this.dialogVisibleImprot2 = false;
        },


        //提交批量更新产品线
        handleEditPriceConfirm2(){
          if (this.da.length == 0){
            this.$message({
              message: '上传数据为空',
              type: 'warning'
            });
            return false;
          }
          this.msg2 = '后台处理中，请耐心等待……';
          this.showFial2 = false;
          this.EditLoading2 = true;
          this.showClose2 = false;
          batchUpdateGoodsLine({list:this.da}).then((res)=>{
            this.$message({
              message: '修改成功',
              type: 'success'
            });
            this.msg2 = '修改成功';
            this.EditLoading2 = false;
            this.dialogVisible2 = false;
            this.showClose2 = true;
            this.da = [];
            this.dialogVisibleImprot2 = false;
            $("#upload").val('');
            this.getUserList();
          }).catch((err)=>{
            this.msg2 = err.msg;
            this.showFial2 = true;
            this.EditLoading2 = false;
            $("#upload").val('');
            this.showClose2 = true;
          })
        },





        //显示审核回收站或黑名单
        showPassItem(item) {
          this.passItem = JSON.parse(JSON.stringify(item));
          this.dialogVisible16 = true;
        },

        //加入回收站或加入公海
        moveItem(){
          let target;
          if(this.passItem.checkType == 'blackList'){  // 审核类别 黑名单
            target = -1;
          }else{// 审核类别 回收站
            target = 0;
          }
          this.dialogVisible16 = false;
          let data = {};
          data.customerIds = [];
          data.customerIds.push(this.passItem.customerId);
          data.target = target;
          setCustomerMove(data).then((res)=>{
            this.$message({
              type: 'info',
              message: '客户已转移'
            });
            this.getUserList();
          }).catch(()=>{
          })
        },

         //审核
        passItemPass(checkState,item){
          this.dialogVisible16 = false;
          let data = {};
          if(item){
            data.customerId = item.customerId;
            data.type = item.typeList;
            data.checkState = checkState;
          }else{
            data.customerId = this.passItem.customerId;
            data.type = this.passItem.checkType;
            data.checkState = checkState;
          }
          customerCheck(data).then(()=>{
            this.$message({
              type: 'info',
              message: '操作成功'
            });
            this.getUserList();
          })
        },

        //获取潜在等级
        getCustomerPotential(){
          customerPotential().then((res)=>{
            this.customerPotentialList = res;
          })
        },
        //显示采购评级
        showSetLabel(item){
           this.dialogVisible5 = true;
           this.labelForm.customerId = item.customerId;
        },
        //关闭采购评级
        handleClose5(){
          this.dialogVisible5 = false;
          this.btnLoading5 = false;
          this.labelForm.customerLabel ='';
          this.labelForm.customerId = '';
        },

        //确认采购评级
        handleConfirm5(){
          this.btnLoading5 = true;
          customersAjaxEdit(this.labelForm).then((res)=>{
            this.btnLoading5 = false;
            this.handleClose5();
            this.getUserList();
          }).catch(()=>{
            this.btnLoading5 = false;
          })
        },
        //解除黑名单
        removeBlack(item){
          operateBlackList({customerId:item.customerId,isBlackList:0}).then((res)=>{
            this.getUserList();
          }).catch(()=>{
          })
        },
        //获取我的部门列表
        getDeptList(){
          myDeptList().then((res)=>{
            this.deptList = res;
          })
        },
        //获取协助人列表
        getAssistList(){
          assistAPI().then((res)=>{
            this.assistList = res;
          })
        },

        //查询客户是否存在
        seachRepeat(){
          if(this.customerForm.businessCode){
            checkBusinessCode({businessCode:this.customerForm.businessCode,customerId:this.customerForm.customerId ? this.customerForm.customerId : 0}).then((res)=>{
              getCompanyInfo({businessCode:this.customerForm.businessCode}).then((companyInfo)=>{
                      console.log("companyInfo",companyInfo)
              })
            }).catch((rej)=>{
              if(rej.code == 10001){
                this.$alert(rej.msg, '提示', {
                  confirmButtonText: '确定',
                });
                this.customerForm.businessCode = null;
              }
            })
          }
        },
        //查询手机号是否存在
        seachRepeat2(){
          if(this.customerForm.contactMobile != '' && this.customerForm.customerId != ''){
            checkContactMobile({contactMobile:this.customerForm.contactMobile,customerId:this.customerForm.customerId ? this.customerForm.customerId : 0 }).then((res)=>{
            }).catch((rej)=>{
              if (rej.code == 10000 || rej.code == 10001) {
                this.$message.error(rej.msg);
                this.customerForm.contactMobile = '';
              }
            })
          }
        },
          //多选表格项
          handleSelectionChange(val) {
              this.multipleSelection = val;
          },

          //显示转移弹窗
          showQuit(item){
            this.multipleSelection = [];
            this.multipleSelection.push(item);
            this.quitForm =  {target:'', remark:''};
            if(item){
              this.itemQuit = item;
            }
              if(this.multipleSelection.length > 0){
                  this.dialogVisible3 = true;
                  let data = {pageNum:1,pageSize:1000,customerId:item.customerId}
                  if(this.listQuery.tab == 'public'){
                    data.tab = 'public'
                  }
                  getStaffsList(data).then(response => {
                      this.list2 = response.list
                  });
              }else{
                  this.$message({
                      message: '请选择要转移的客户',
                      type: 'warning',
                      duration: 1000
                  });
              }
          },
          //关闭转移弹窗
          handleClose3(){
              this.dialogVisible3 = false;
              this.btnLoading3 = false;
              this.quitForm.target = '';
          },

          //确认转移
          handleConfirm3(){
            this.$refs.quitForm.validate((valid) => {
              if (valid) {
                let ids=[];
                for(let i=0;i<this.multipleSelection.length;i++){
                  ids.push(this.multipleSelection[i].customerId);
                }

                this.btnLoading3 = true;
                let data = {};
                data.customerIds = ids;
                data.target = this.quitForm.target;
                data.remark = this.quitForm.remark;
                setCustomerMove(data).then((res)=>{
                  this.btnLoading3 = false;
                  this.handleClose3();
                  this.getUserList();
                }).catch(()=>{
                  this.btnLoading3 = false;
                })
              }
            })

          },


        //关闭删除弹窗
        handleClose4(){
          this.dialogVisible4 = false;
          this.btnLoading4 = false;
          this.delForm.remark = '';
        },

        //确认删除
        handleConfirm4(){
          this.$refs.delForm.validate((valid) => {
            if (valid) {
              let ids=[];
              this.btnLoading4 = true;
              for(let i=0;i<this.multipleSelection.length;i++){
                ids.push(this.multipleSelection[i].customerId);
              }
              let data = {};
              data.customerIds = ids.join(",");
              data.isDelete = 1;
              data.deleteReason = this.delForm.remark;
              delCustomer(data).then((res)=>{
                this.$message({
                  type: 'success',
                  message: '删除成功!'
                });
                this.btnLoading4 = false;
                this.handleClose4();
                this.getUserList();
              }).catch(()=>{
                this.btnLoading4 = false;
              })
            }
          })

        },

        //批量删除
        showDel(item){
          console.log("item",item)
          if(item != ''){
            this.multipleSelection = [];
            this.multipleSelection.push(item)
          }
          if(this.multipleSelection.length > 0){
            console.log("341412",this.multipleSelection)
            this.dialogVisible4 = true;
          }else{
            this.$message({
              message: '请选择要删除的客户',
              type: 'warning',
              duration: 1000
            });
          }
        },

        //还原客户
        huanyuang(item){
          let data = {};
          data.customerIds = item.customerId+'';
          data.isDelete = 0;
          delCustomer(data).then((res)=>{
            this.$message({
              type: 'success',
              message: '已还原!'
            });
            this.getUserList();
          })
        },

        //永久删除
        neverDel(item){
          this.$confirm('确认永久删除此客户信息吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            customerNeverDel({customerId:item.customerId}).then((res)=>{
              this.$message({
                type: 'success',
                message: '已删除成功!'
              });
              this.getUserList();
            })
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        },



          //显示新建编辑客户弹窗
          toAddCustomer(type,item){
            if(type=='add'){
              this.$router.push({name:'addCustomerPL'})
            }else{
              localStorage.setItem('customerListQuery', JSON.stringify(this.listQuery));
              this.$router.push({name:'addCustomer',query:{type:type,customerId:item.customerId}})
            }
            //    this.dialogVisible = true
            //   if(type == 'add'){
            //       this.title = '新增客户';
            //       this.customerForm = JSON.parse(JSON.stringify(defaultCustomerForm));
            //       this.creator = this.name != '' ? this.name : this.mobile;
            //       this.customerForm.chargeId = this.userId;
            //       this.customerForm.assistIds = [];
            //       this.assistList.forEach((el)=>{
            //         if(el.isDefault){
            //           this.customerForm.assistIds.push(el.userId)
            //         }
            //       });
            //   }else{
            //       this.title = type=='edit'?'编辑客户':'查看客户';
            //       getCustomersInfo({customerId:item.customerId}).then(res=>{
            //           this.creator = res.creator.realName;
            //           this.customerForm.customerId = res.customerId;
            //           this.customerForm.customerState = res.customerState.cddId;
            //           this.customerForm.customerType = res.customerType.cddId;
            //           this.customerForm.customerIndustry = res.customerIndustry.cddId;
            //           this.customerForm.customerSource = res.customerSource.cddId;
            //           this.customerForm.customerQuality = res.customerQuality.cddId;
            //           this.customerForm.customerDegree = res.customerDegree.cddId;
            //           this.customerForm.customerName = res.customerName;
            //           this.customerForm.contactName = res.contactName;
            //           this.customerForm.contactMobile = res.contactMobile;
            //           this.customerForm.transactionTime = res.transactionTime.cddId;
            //           this.businessCode = res.businessCode;
            //           this.contactDuty = res.contactDuty;
            //           this.customerForm.assistIds = [];
            //           this.customerForm.isBuyPermission = res.isBuyPermission;
            //           this.customerForm.transactionEndTime = res.transactionEndTime;
            //           res.assister.forEach((el)=>{
            //               this.customerForm.assistIds.push(el.userId)
            //           });
            //           this.customerForm.chargeId = res.charge.userId;
            //           this.customerForm.provinceId = res.provinceId;
            //           this.customerForm.cityId = res.cityId;
            //           this.customerForm.areaId = res.areaId;
            //           this.diQuIds = this.customerForm.provinceId ? [this.customerForm.provinceId ,this.customerForm.cityId,this.customerForm.areaId] :[];
            //           this.customerForm.addressDetail =res.addressDetail;
            //           this.customerForm.customerUrl = res.customerUrl;
            //           this.customerForm.customerDetail = res.customerDetail;
            //       })
            //   }
          },

          //关闭新建编辑弹窗之前
          beforeClose(){
              this.dialogVisible = false;
              this.$refs.customerForm.clearValidate();
          },

          //关闭新建编辑弹窗
          handleClose(){
              this.dialogVisible = false;
              this.$refs.customerForm.clearValidate();
          },

          //提交新建编辑
          handleConfirm(){
              this.$refs.customerForm.validate((valid) => {
                  this.customerForm.provinceId = this.diQuIds[0] ? this.diQuIds[0] : null;
                  this.customerForm.cityId = this.diQuIds[1] ? this.diQuIds[1] : null;
                  this.customerForm.areaId = this.diQuIds[2] ? this.diQuIds[2] : null;
                  if (valid) {
                      this.btnLoading = true;
                      updateCustomers(this.customerForm).then(()=>{
                          this.btnLoading = false;
                          this.handleClose();
                          this.getUserList();
                      }).catch(()=>{
                          this.btnLoading = false;
                      })
                  }
                })
          },
          //获取员工下拉选项
          getUserOptionList(){
              getUserOption().then((res)=>{
                  this.userOptionList = res;
              })
          },

          //选择员工名称
          handleSelectUserName(key,item){
              this.listQuery[key] = item.userId;
          },


          //客户名称输入匹配
          querySearch(queryString, cb){
            let data = {};
            data.keywords = queryString;
            if(this.listQuery.tab == 'my' || this.listQuery.tab == 'dept' || this.listQuery.tab == 'company'){
              data.hasOne = 1
            }
            if(this.listQuery.tab == 'my'){
              // data.chargeId = this.userId;
              data.tab = 'my'
            }
              getCustomerOption(data).then((res)=>{
                  cb(res);
              })
          },

          //选择客户名称
          handleSelectCustomerName(item){
              this.listQuery.keyword = item.customerName
          },

          //获取客户配置
          getCustomerSettingList(){
              getCustomerSetting().then((res)=>{
                  res.forEach((el)=>{
                      if(el.cdtCode == 'customer_state'){
                          this.customerStateList = el.data
                      }else if(el.cdtCode == 'customer_type'){
                          this.customerTypeList = el.data;
                      } else if(el.cdtCode == 'customer_tracking'){
                          this.customerTrackingList = el.data;
                      }else if(el.cdtCode == 'customer_source'){
                          this.customerSourceList = el.data;
                      }else if(el.cdtCode == 'customer_quality'){
                          this.customerQualityList = el.data;
                      }else if(el.cdtCode == 'customer_degree'){
                          this.customerDegreeList = el.data;
                      }else if(el.cdtCode == 'customer_industry'){
                          this.customerIndustryList = el.data;
                      }else if(el.cdtCode == 'transaction_time'){
                        this.closingTimeList = el.data
                      }else if(el.cdtCode == 'un_order_reason'){
                        this.unOrderReasonlist = el.data;
                      }else if(el.cdtCode == 'un_order_solutions'){
                        this.unOrderSolutionslist = el.data;
                      }else if(el.cdtCode == 'goods_line'){
                      this.goodsLineList = el.data
                    }
                  });
              })
          },

        /**
         * 切换选择状态
         */
        handleSelect(key, keyPath){
          // this.listQuery = JSON.parse(JSON.stringify(defaultListQuery));
          this.listQuery.tab = key;
          if(this.listQuery.tab=='my'){
            this.listQuery.customerTracking = '';
          }
         if(this.listQuery.tab!='dept' && this.listQuery.tab!='company'){
            this.listQuery.departmentId = '';
            this.listQuery.chargeId = '';
            this.listQuery.createrId = '';
         }
         if(this.listQuery.tab!='company'){
           this.listQuery.hasBusinessCode = '';
           this.listQuery.typeList = [];
           this.listQuery.profitType = '';
         }
         if(this.listQuery.tab!='my'){
           this.listQuery.hasBusinessCode = '';
         }
          if(this.listQuery.tab!='threeMonths'){
            this.listQuery.diQuIds = [];
          }
          if(this.listQuery.tab!='my' && this.listQuery.tab != 'public' && this.listQuery.tab != 'dept' && this.listQuery.tab != 'company'){
            this.listQuery.lastOrderTime = []
          }
          if(this.listQuery.tab!='my' && this.listQuery.tab != 'dept' && this.listQuery.tab != 'company'){
            //是否显示子客户去掉
          }
           if(key){
             this.handleSearchList();
           }else{
             this.tableData = [];
             this.listQuery.pageNum = 1;
             this.count = 0;
           }
        },
        handleSizeChange(val){
          this.listQuery.pageNum = 1;
          this.listQuery.pageSize = val;
          this.getUserList();
        },
        handleCurrentChange(val){
          this.listQuery.pageNum = val;
          this.getUserList();
        },

        handleSearchList(){
          this.listQuery.pageNum = 1;
          this.getUserList();
        },

        //获取客户列表
        getUserList() {
          this.listLoading = true;
          let fn;
          let listQuery = {};
          if(this.listQuery.tab == 'blacklist'){
            fn = getBlackList;
            listQuery.keyword = this.listQuery.keyword;
            listQuery.pageNum = this.listQuery.pageNum;
            listQuery.pageSize = this.listQuery.pageSize;
          }else if(this.listQuery.tab == 'threeMonths'){
            fn = unOrderCustomers;
            listQuery.keyword = this.listQuery.keyword;
            listQuery.chargeId = this.listQuery.chargeId;
            listQuery.diQuIds = this.listQuery.diQuIds;
            listQuery.dayNum = this.dayNum;
            listQuery.unOrderReasonId = this.unOrderReasonId;
            listQuery.pageNum = this.listQuery.pageNum;
            listQuery.pageSize = this.listQuery.pageSize;
          }else if(this.listQuery.tab == 'examine'){
            fn = customerWaitCheck;
            listQuery.customerName = this.listQuery.customerName;
            listQuery.pageNum = this.listQuery.pageNum;
            listQuery.pageSize = this.listQuery.pageSize;
          }else if(this.listQuery.tab == 'my' || this.listQuery.tab == 'waitMyCheck'){
             fn = customersMyCharge;
             listQuery = JSON.parse(JSON.stringify(this.listQuery));
          }else if(this.listQuery.tab == 'fz'){
            fn = partnerList;
            listQuery.customerName = this.listQuery.customerName;
            listQuery.createrId = 178;
            listQuery.tab = 'company';
            listQuery.pageNum = this.listQuery.pageNum;
            listQuery.pageSize = this.listQuery.pageSize;
          }else if(this.listQuery.tab == 'guanlian'){
            fn = getRelationList;
            listQuery.keyword = this.listQuery.keyword;
            listQuery.chargeId = this.listQuery.chargeId;
            listQuery.createrId = this.listQuery.createrId;
            listQuery.pageNum = this.listQuery.pageNum;
            listQuery.pageSize = this.listQuery.pageSize;
          }else{
            fn = partnerList;
            listQuery = JSON.parse(JSON.stringify(this.listQuery));
          }
          if(this.listQuery.tab == 'my' || this.listQuery.tab == 'company' || this.listQuery.tab == 'dept' || listQuery.tab=='public'){
            listQuery.orderBy = this.sort;
            listQuery.areaId1 = this.areaId1;
            listQuery.areaId2 = this.areaId2;
            listQuery.areaId3 = this.areaId3;
            listQuery.hasCustomerType = this.hasCustomerType;
            listQuery.hasAgreement = this.hasAgreement;
          }
          if(this.listQuery.tab == 'company' ){
            listQuery.isMainCustomer = this.isMainCustomer
          }
          if(listQuery.tab=='public'){
            listQuery.goodsLineId = this.listQuery.goodsLineId
          }
          if(!this.listQuery.tab){
            listQuery.hasOne = 1;
            listQuery.tab = 'repeatList'
          }
          fn(listQuery).then(response => {
            switch (this.listQuery.tab ) {
              case 'threeMonths' :
                this.tableData2 = response.list;
                break;
              case 'examine' :
                this.tableData3 = response.list;
                break;
              case 'waitMyCheck' :
                this.tableData4 = response.list;
                break;
              case 'guanlian' :
                this.tableData6 = response.list;
                break;
            }
            this.tableData = response.list;
            this.count = response.count;
            this.listLoading = false;
          }).catch(()=>{
            this.listLoading = false;
          });
        },

        //去详情页
        toDetail(item,parentId){
          localStorage.setItem('customerListQuery', JSON.stringify(this.listQuery));
          localStorage.setItem('customerListQuery2', JSON.stringify({
            areaId1:this.areaId1,
            areaId2:this.areaId2,
            areaId3:this.areaId3,
            areaIndex1:this.areaIndex1,
            areaIndex2:this.areaIndex2,
            sort:this.sort,
            hasCustomerType:this.hasCustomerType,
            hasAgreement:this.hasAgreement,
            options : this.options,
            isMainCustomer:this.isMainCustomer,
          }));
          if(parentId){
            this.$router.push({name:'customerDetail',query:{id:parentId}})
          }else{
            this.$router.push({name:'customerDetail',query:{id:item.customerId}})
          }

          // let routeData = this.$router.resolve({name:'customerDetail',query:{id:item.customerId}});
          // window.open(routeData.href);
        },

        //获取省市区列表
        getAddressListData(){
            getAddressList().then((res)=>{
                this.options = res;
            })
        },

        //关联客户导出
        guanglianDownloadExcel(){
          let params = {};
          params.keyword = this.listQuery.keyword;
          params.chargeId = this.listQuery.chargeId;
          params.createrId = this.listQuery.createrId;
          params.isExport = 1;
          this.btnLoading9 = true;
          getRelationList(params).then((res)=>{
            this.btnLoading9 = false;
            require.ensure([], () => {
              const { export_json_to_excel } = require('sheet/Export2Excel');
              const tHeader = res.title;
              const filterVal = res.columns;
              const list = res.list;
              const data = this.formatJson(filterVal, list);
              export_json_to_excel(tHeader, data, res.fileName);
            })
          }).catch(()=>{
            this.btnLoading9 = false;
          })
        },



        //下载excle
        downloadExcel(){
            let params = JSON.parse(JSON.stringify(this.listQuery));
            params.orderBy = this.sort;
            params.areaId1 = this.areaId1;
            params.areaId2 = this.areaId2;
            params.areaId3 = this.areaId3;
            params.hasCustomerType = this.hasCustomerType;
            params.hasAgreement = this.hasAgreement;
            params.isMainCustomer = this.isMainCustomer;
            exportCustomers(params).then((res)=>{
              require.ensure([], () => {
                const { export_json_to_excel } = require('sheet/Export2Excel');
                const tHeader = res.title;
                const filterVal = res.columns;
                const list = res.list;
                const data = this.formatJson(filterVal, list);
                export_json_to_excel(tHeader, data, res.fileName);
              })
            })
        },

        //下载表格数据格式化
        formatJson(filterVal, jsonData) {
          return jsonData.map(v => filterVal.map(j => v[j]))
        },

          //显示批量导入弹窗
          showImport(type){
              this.showFial = false;
              this.EditLoading = false;
              this.uploadLoading = false;
              this.msg = '';
              this.dialogVisibleImprot = true;
              if(type){
                  this.poptitle = '批量客户转移';
                  this.url = '/api/customers/template/download?type=importBatchMove&token=' + this.token;
                  this.importType = 'zuanyi'
              }else{
                this.poptitle = '批量导入客户';
                this.url = '/api/customers/template/download?token=' + this.token;
                this.importType = 'kehu'
              }
          },
          //关闭批量导入弹窗
          beforeCloseEditPrice(){
              $("#upload").val('');
              this.da = [];
              this.msg = '';
              this.dialogVisibleImprot = false;
          },


          //提交批量导入
          handleEditPriceConfirm(){
              if (this.da.length == 0){
                  this.$message({
                      message: '上传数据为空',
                      type: 'warning'
                  });
                  return false;
              }
              this.msg = '后台处理中，请耐心等待……';
              this.showFial = false;
              this.EditLoading = true;
              this.showClose = false;
              let fn;
              fn = this.importType == 'kehu' ? importCustomer : importBatchMove;
              fn({list:this.da}).then((res)=>{
                  this.$message({
                      message: '修改成功',
                      type: 'success'
                  });
                  this.msg = '修改成功';
                  if(res.content != ''){
                    this.msg = res.content;
                  }
                  this.EditLoading = false;
                  this.dialogVisible = false;
                  this.showClose = true;
                  this.da = [];
                  this.dialogVisibleImprot = false;
                  $("#upload").val('');
                  this.getUserList();
              }).catch((err)=>{
                  this.msg = err.msg;
                  this.showFial = true;
                  this.EditLoading = false;
                  $("#upload").val('');
                  this.showClose = true;
              })
          },

          //导入excel
          importfxx(obj) {
              let _this = this;
              this.uploadLoading = true;
              let inputDOM = this.$refs.inputer;
              // 通过DOM取文件数据
              this.file = event.currentTarget.files[0];
              var rABS = false; //是否将文件读取为二进制字符串
              var f = this.file;
              var reader = new FileReader();
              //if (!FileReader.prototype.readAsBinaryString) {
              FileReader.prototype.readAsBinaryString = function(f) {
                  var binary = "";
                  var rABS = false; //是否将文件读取为二进制字符串
                  var pt = this;
                  var wb; //读取完成的数据
                  var outdata;
                  var reader = new FileReader();
                  reader.onload = function(e) {
                      var bytes = new Uint8Array(reader.result);
                      var length = bytes.byteLength;
                      for(var i = 0; i < length; i++) {
                          binary += String.fromCharCode(bytes[i]);
                      }
                      var XLSX = require('xlsx');
                      if(rABS) {
                          wb = XLSX.read(btoa(fixdata(binary)), { //手动转化
                              type: 'base64'
                          });
                      } else {
                          wb = XLSX.read(binary, {
                              type: 'binary'
                          });
                      }
                      outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);//outdata就是你想要的东西
                      // if (outdata.length  > 200){
                      //   _this.$message({
                      //     message: '最大上传200条',
                      //     type: 'error'
                      //   });
                      //   var test = document.getElementById('upload');
                      //   test.value = '';
                      //   return false;
                      // }
                      _this.da = [...outdata];
                      console.log("da",_this.da)
                      let arr = [];

                      let para = {
                          withList: arr
                      };
                      _this.$message({
                          message: '上传成功，请点击提交',
                          type: 'success'
                      });
                      _this.uploadLoading = false;
                  };
                  reader.readAsArrayBuffer(f);
              };
              if(rABS) {
                  reader.readAsArrayBuffer(f);
              } else {
                  reader.readAsBinaryString(f);
              }
          },

      },
    }
</script>

<style scoped lang="scss">
  .upload-div{
    text-align: center;
    position:relative;
    #upload{

      opacity: 0;
      position: absolute;
      z-index: 1;
      width:154px;
      height:40px
    }
  }
  .title-tab{
    border-radius: 8px;
    background: #eee;
    margin-left: 10px;
    display: inline-block;
    vertical-align: middle;
    line-height: 20px;
    padding: 0 5px;
    color: #666;
  }

</style>
